CODEWITHSUNDEEP
extjsaem
user3716536
user3716536

Reputation: 11

How to validate a cq5 dropdown widget (xtype=selection & type=select) on text change?

I have a drop down (xtype=selection & type=select) in multi-field widget in cq5 dialog. I am populating the drop down dynamically using "options" property. I have also added "editable" property as true so that authors can type and choose a value from large number of list of values in drop down. Now the problem is, authors can type any value and save but i want to throw error as soon as the typed value does not match any value in the drop down and do not save the dialog. I am ok to change the widget type as long as my functionality is achieved. I can write a servlet to validate in the back-end. Can anyone help me with the correct event that i should use to achieve this?

Note: 'selectionchanged' event does not satisfy my requirement. I need something like 'change' in textfield.

Upvotes: 1

Views: 1287

Answers (1)

Mateusz Chromiński
Mateusz Chromiński

Reputation: 2832

Instead of handling the on change event, creating validation message by your own and erasing all errors when required, just attach to the existing validation pipe.

CQ Ext.form.TextField widget accepts the validator object. You can pass it either in the widget declaration 

<value
    jcr:primaryType="cq:Widget"
    fieldLabel="Provide value"
    name="./value"
    validator="function(value) { }"
    xtype="textfield"/>

or in JS if you are overriding the xtype:

constructor : function(config) {
    config = CQ.Util.applyDefaults(config, {
        "validator": function(value) {
        }
    }
    ...
}

The function itself should return true if there are no errors (so field validates) or a string with a proper validation message when some error occurs.

In your case, you just need to iterate over all dropdowns and check if the typed value is matching any of those.

On the other hand - if the author must provide a value from a complete set - I think it might be a good experience for him to provide him another dropdown with only allowed values.

Upvotes: 2

Related Questions