ansaurus

Question

How do I highlight all invalid dijit.form.ValidationTextBoxes on a dijit.form.Form?

Answer 1

+2 A:

jthomas_ in #dojo on irc.freenode.net answered my question. It turns out that I wanted to be using dijit.byId('myForm').validate() which does everything I wanted in one swoop. Thanks, jthomas_!

Aaron B. Russell 2010-09-27 09:45:12

Answer 2

+3 A:

Yes, you're correct - you can get all your validation, highlighting, even focus on the first invalid field by just calling the validate() function on a dijit.form.Form element.

Here's an example where the validate() call is added to the onSubmit event:

<head>
    <script type="text/javascript">
        dojo.require("dojo.parser");
        dojo.require("dojo.form.Form");
        dojo.require("dojo.form.ValidationTextBox");
        dojo.require("dojo.form.Button");
        // more includes here...
    </script>
</head>
<body>
    <form dojoType="dijit.form.Form" action="..." method="...">
        <input dojoType="dijit.form.ValidationTextBox" trim="true" regExp="..." invalidMessage="Oops...">
        <!-- // more form elemts here... -->
        <button type="submit" dojoType="dijit.form.Button" ...>
            Submit
        </button>
        <script type="dojo/method" event="onSubmit">
            if (!this.validate()) {
                alert("Form contains invalid data.  Please correct....");
                return false;
            }
            return true;
        <script>
    </form>
</body>

Hope, you find it helpful.

Cheers.

Follow-up: Here's an example of an input field that could be used to help prompt a user as to what sort of data is expected, and would alert them when validation fails:

<input type="text" id="EXT" name="EXT" value=""
    maxLength="10"
    dojoType="dijit.form.ValidationTextBox"
    regExp="\d+?"
    trim="true"
    promptMessage="<p class='help'>Please your extension. (i.e. "1234")</p>"
    invalidMessage="<p class='help'>The extension field should contain only numbers.</p>">

This is a declarative example. (I misspelled it in my initial response below.)

S.Jones 2010-09-27 23:37:26

How would I easily tell which form elements are invalid, so I can tell the user what they have to fix?

Jords 2010-10-01 02:36:54

@Jords This type of implementation would automatically highlight all invalid fields and even set the focus to the first incorrect field. If you had a phone extension field for example, you could use the regExp="\d+?" attribute in the ValidationTextBox, and a invalidMessage="The extension field should contain only numbers." attribute would be displayed in an error condition. So, basically you can decoratively define your validation conditions and user messages and/or prompt messages as well.

S.Jones 2010-10-01 02:54:01

@Jords I've added an example in the answer above. Note that you can use HTML tags in the 'prompt' and 'invalid' messages to make thing look nice. Hope that helps.

S.Jones 2010-10-01 03:06:42

ansaurus

tags:

views:

answers:

How do I highlight all invalid dijit.form.ValidationTextBoxes on a dijit.form.Form?

related questions