XPages Tip: Disabling Required Validation in a Dojo Filtering Select

Dojo Filtering Select (xe:djFilteringSelect) controls include client side ‘required’ validation by default. The problem is that if it fails this validation, any page submission or other server-side action will not be triggered. However, if you want to disable this validation, the built-in property of the control doesn’t work. In this post, I’ll show how to achieve the desired effect.

Creating a Filtering Select

If you’re not familiar with the Dojo Filtering Select, take a look at this post.

Validation Behavior

Take, for example, the Dojo Filtering Select that I used in a recent post about changing the search behavior of a Dojo Filtering Select:

FilteringSelect_Required-1

If I clear the value in the field and tab out of it, I am presented with this error message: ‘This value is required’

FilteringSelect_Required-2

The problem is that any server-side onChange error handler of the field will not fire because the field failed client-side validation.

Disabling the Required Validation

The Dojo documentation shows that adding a required attribute and setting it to false will disable this behavior.

There’s a required property on the djFilteringSelect control. Unfortunately, it has no effect when set to false.

If you look at the HTML output, you’ll see that the field has this attribute: aria-required="true"

To get it to work, you can add the required attribute (and set it to false) as a Dojo attribute.

FilteringSelect_Required-3

This does the job and it changes the attribute in the HTML output for the page to: aria-required="false"

Advertisements

7 responses to “XPages Tip: Disabling Required Validation in a Dojo Filtering Select”

  1. Rich Owens says :

    Perfect! Just what I was looking for. Thanks!!!

  2. Cameron Gregor says :

    Brilliant, thanks Brad just what I needed

  3. FAOM says :

    ok good, but how to do it programatically Im trying with something like dijit.byId(‘elemen_id’).attr(‘required’,false); but it doesn’t work

    • Brad Balassaitis says :

      I haven’t tried this, but, if you’re in the XPages context, the first thing that comes to mind is to check that you’re getting a proper handle to the dijit via the generated client-side ID, using #{id:element_id} rather than just referring to the element ID that you give it in Designer.

      The next thing I’d try would be getting a handle to the dijit via the browser’s developer tools and looking at what attributes and methods are available. It may be something more like this:

      dijit.byId(‘#{id:My_Element}’).required = false;

  4. Christian says :

    Thanks Brad for this article.
    And what about disabling the “item validation” process?
    If I type something wrong the client-side validation informs me that no values match the input string. And I cannot submit the inserted value too.
    How can I disable this behaviour?

    Thanks.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: