XPages - display validation messages when Dojo is used

Question

I have an XPage which is divided into several Dojo content panes. I use Client side JavaScript to decide which Dojo content pane is displayed. I now want to add validation for several required fields to the XPage. However, for both client side and server side validation, the document is prevented from saving but if the field requiring validation is in a Dojo content pane other than the Dojo content pane currently being displayed, the user does not get to see the server side error message and the cursor is not placed in the field which has failed validation (the client side message is visible but again the cursor is not placed in the field which has failed validation). Is there any way I can add CSJS code to be executed when a field fails validation? (ideally I would like to use server side validation only)

Here is a field requiring validation

<xp:inputText id="FirstName" value="#{document1.FirstName}" required="true">
    <xp:this.validators>
        <xp:validateRequired>
            <xp:this.message><![CDATA["REQUIRED"]]></xp:this.message>
        </xp:validateRequired>
        <xp:validateLength minimum="5" maximum="10">
            <xp:this.message><![CDATA["VALIDATE"]]></xp:this.message>
        </xp:validateLength>
    </xp:this.validators>
</xp:inputText>

Here the code for a Dojo content pane

<xe:djContentPane id="Employee">

Here CSJS code to show or hide a Dojo content pane

var Allgemein = dojo.byId("#{id:Allgemein}");
if (sectionDisplay == "Allgemein") {
    dojo.style(Allgemein, "display", "block");
} else {
    dojo.style(Allgemein, "display", "none");
}
var sectionDisplay = dojo.cookie("sectionDisplay");

I would be really helpful if you could include some code snippet in your question. — Naveen
Here is a field requiring validation <xp:inputText id="FirstName" value="#{document1.FirstName}" required="true"> <xp:this.validators> <xp:validateRequired> <xp:this.message><![CDATA["REQUIRED"]]></xp:this.message> </xp:validateRequired> <xp:validateLength minimum="5" maximum="10"> <xp:this.message><![CDATA["VALIDATE"]]></xp:this.message> </xp:validateLength> </xp:this.validators> </xp:inputText> here the code for a dojo content pane <xe:djContentPane id="Employee"> — user1358852
here csjs code to show or hide a dojo content pane var Allgemein = dojo.byId("#{id:Allgemein}"); if (sectionDisplay == "Allgemein") { dojo.style(Allgemein, "display", "block");} else { dojo.style(Allgemein, "display", "none"); } var sectionDisplay = dojo.cookie("sectionDisplay"); — user1358852
Comment is really not a good place to put your code. Can you please edit your question and put the code in it? — Naveen

stwissel stwissel · Accepted Answer · 2013-07-22T14:40:27

There is a number of things you can do, depending on how sophisticated your code supposed to be. If you only want to check (client-side) for required fields, add an onSubmitEvent and look for fields that have aria-required as attribute. Out of those you build a display that allows the user to jump to the offending control(s) - the empty ones.

If you rather do server-side validation, since you don't know what all you want to validate, then have a onload script (submission refreshed the page) or one running after the partial refresh that looks for the aria-invalid attribute. You then can render a list or table listing jumps to the required control since you might have multiple on different panes

I would put the errormessages control (the one that shows server side validation errors) in a pane on top that is always visible (always as in: if the errormessages isn't empty).

makes sense?

XPages - display validation messages when Dojo is used

1 Answers