custom validation message in Date Selector

Mansoor_Haider

Hi there,

We have updated the date selector widget's date.jsp to disable all the previous dates in the calendar popup. Now we would like to inject a custom validation or modify the OOTB validation message on failure?. How can this be achieved?.

 

 

Trilochan_Singh

Date widget come with few inbuild validators. In your case you have to override one of the validator type (vui.vcm.ui.editor.widget.validator.VALIDATION_TYPE_KEY_NONE).

Refer this script :

// START

    var contentEditor = vui.ui.editor.find(editorId);     // get editor object - editorId is CI 40 char guid   
    if(contentEditor.typeXmlName == "<CTD_XML_NAME>"){ // Use only for specific Content type
        var validatorArray = contentEditor.widgets[".<CTD_XML_NAME>.<DATE_ATTRIBUTE_XML_NAME>"].validators;  // get validators applied on the widget attribute
        validatorArray.forEach(processCustomValidator);

        // Process validator which we are going to modify.
        function processCustomValidator(value,index) {
            if(value.validationType == vui.vcm.ui.editor.widget.validator.VALIDATION_TYPE_KEY_NONE){

                var dateAttributeWidget = contentEditor.widgets[".<CTD_XML_NAME>.<DATE_ATTRIBUTE_XML_NAME>"];
                myFunction1 ={validate:function(fieldObj,value,callback){
                    if(!value){
                        this.valid=true;
                        return this.valid;
                    }
                    this.valid=false;
                    var widgetObj=vExt.getCmp(fieldObj.fieldId);
                    var widgetValue=widgetObj.getValue();
                    if(!widgetValue||!vExt.isDate(widgetValue)){
                        this.failureMsg="Custom message : Enter Valid date";
                    }else{
                        if(widgetObj.minValue&&(widgetValue.getTime()<widgetObj.minValue.getTime())){
                            this.failureMsg="Custom message : Min Date should be ##/##/####";
                        }else{
                            if(widgetObj.maxValue&&(widgetValue.getTime()>widgetObj.maxValue.getTime())){
                                this.failureMsg="Custom message : Max Date should be ##/##/####";
                            }else{
                                this.valid=true;
                            }
                        }
                    }
                    if(callback){
                        callback(this.valid,this.failureMsg);
                    } 
                    return this.valid;
                }};
                // Push the modified validator object to the same index
                dateAttributeWidget.validators[index]=(new vui.vcm.ui.editor.widget.validator.Validator({valid:false,validationType:vui.vcm.ui.editor.widget.validator.VALIDATION_TYPE_KEY_NONE,validate:myFunction1.validate}));  
            }
        }
    }

// END

// Remember to use this script when widget is loaded/exist on page. I placed it in js file (added the js path in my theme.xml under <c:javascript><c:resource path="/mywar/myjs.js" /></c:javascript>) and called the function from the last widget override jsp.