Search code examples
validationxpagesxpages-ssjs

Xpages - SSJS validation, with CSJS onComplete


I am using a re-usable custom control, one of the custom properties for the field on each custom control is to specify if the field is required, yes or no. If yes, and the field is blank, it displays some help text, and changes colour to red. This is all fine. However, I have ALOT of these fields on my form, and so I want to display a message at the top of the screen if one or more fields have failed validation and I'm not sure how I can do this. I have a "Submit" button, and clicking it works, but I can't get it to run any SSJS, as the fields are not passing validation, so it never runs the code. I was thinking I could do something with the CSJS onComplete, however I'm not sure how I can get a handle on if validation has failed "somewhere" without listing all the field names and looping through them all. The end goal, if validation fails, is to show a message back to the user and stop processing anymore code. If validation passes, I then call a modal. I can get all those bits working, but I just need to know how to get a handle on whether validation has passed/failed and continue to execute some code if it fails.

I think I can use facesContext.getMessages().hasNext() to check for messages, but again, I can't even call that as any fields that are "required" stop the rest of my code from running.

Thanks in advance for any pointers


Solution

  • I have resolved this as follows:

    computedText, hidden:

    <xp:text escape="true" id="cmpValidation" style="display:none">
            <xp:this.value><![CDATA[#{javascript:if(facesContext.getMessages().hasNext()){
        return "Fail";
    }else{
        return "Succes";
    }}]]></xp:this.value>
        </xp:text>
    

    Then, in the onComplete of my button I check for the value in the computed field, if there is a value there, validation failed, so I display a notification to the user. If not, validation has passed, and I instead show my modal.

    <xp:button value="Test Submit" id="button3" styleClass="btn btn-header">
    
    
    
        <xp:eventHandler event="onclick" submit="true" refreshMode="partial"
            refreshId="contentWhiteBackground">
    
    
    
            <xp:this.onComplete><![CDATA[var val = XSP.getElementById("#{id:cmpValidation}").innerHTML;
    
    if(val =="Fail"){
        var o = {};
        o.title = "Validation Failed";
        o.body = "You must complete all questions before submitting";
        o.alertIcon = "fa-thumbs-down fa-lg";
        o.alertType = "danger";
    
        var myDiv = document.getElementById("#{id:contentWhiteBackground}");
        myDiv.scrollTop = 0;
        bootAlert.show('alertServer',JSON.stringify(o));
    
    }else{
        $('#modalConclusion').modal('show');
    }
    ]]></xp:this.onComplete>
        </xp:eventHandler>
    
    </xp:button>