CODEWITHSUNDEEP
dojotooltiphide
user1829449
user1829449

Reputation: 69

how to hide dojo validation error tooltip?

I'm using dojo to validate input fields and if there is an error (for eg: required field) it appears in the dojo tooltip. But, I would like to show error in the custom div instead of tooltip.

So, I'm wondering if there is a way to hide/disable the validate error to appear in the tooltip? If so, I can capture the error message shown in the hidden tooltip and show the result in custom div, which will be consistent with error styling across the application.

Please advise. Thanks.

Upvotes: 1

Views: 1414

Answers (2)

vivek_nk
vivek_nk

Reputation: 1600

Simple solution for this scenario is not to add the "required" condition at all to those fields. Instead add a separate event handler or function to check for this validation.

For eg: add a function for onBlur event. Check if the field is a mandatory. If so, show message in the custom div as expected.

<input data-dojo-type="dijit/form/TextBox" 
   id="sampleText" type="text" mandatory="true" onBlur="checkMandatory(this)"/>


function checkMandatory(field) {
    if(field.mandatory=='true' && field.value=="") {
        alert('value required'); // replace this code with my showing msg in div
    } else {
        field.domNode.blur();
    }
}

This above code snippet does not use Dojo for validation, rather manual. Dojo actually helps to ease this by just adding the attribute "required". If that is not required, then just ignore Dojos help for this case and go native. So, for all fields, just add the attributes - "mandatory" & "onBlur", and add the above given function for onBlur action for all these fields.

Upvotes: -1

PaulR
PaulR

Reputation: 316

I would recommend to use the standard Dojo validation mechanism, contrary to what vivek_nk suggests. This mechanism works great in most cases, and covers most situations (required, regular expressions, numbers, dates etc.).

To solve your issue: you can overrule the "dispayMessage" function of a ValidationTextBox (for example).

        displayMessage: function(/*String*/ message){
        // summary:
        //      Overridable method to display validation errors/hints.
        //      By default uses a tooltip.
        // tags:
        //      extension
        if(message && this.focused){
            Tooltip.show(message, this.domNode, this.tooltipPosition, !this.isLeftToRight());
        }else{
            Tooltip.hide(this.domNode);
        }
    }

Just create your own ValidationTextBox widget, extend dijit/form/ValidationTextBox, and implement your own "displayMessage" function.

Upvotes: 4

Related Questions