required check for other form widgets (checkbox, textarea, etc)

[guest]

ValidationTextbox is a great widget for form validation, but to really use dojo for full form validation I think a couple issues need to be addressed. The following objects could use a required="true" attribute for form validation:

MultiSelect, FilteringSelect, ComboBox CheckBox, Radio Textarea, SimpleTextarea

What's nice about ValidationTextbox? is the interface it presents to the user when invalid data is entered. In order to make any of the above required form elements, custom validation coding is needed - unless I missed something???

I believe dojo.validate.check in 0.4 used to support validating some of these items before.

Thanks,

Josh

[guest]

Ack - sorry, meant to file as feature request/enhancement - not defect.

[bill]

Hmm I'm not sure exactly what you are asking for, in terms of the UI. Just to flag the field on form submit and display the error that it needs to be filled in, or having the yellow ! mark that appears in the right section like in TextBox? Because I'm not sure how to display that validation icon for Textarea or CheckBox?.

BTW doesn't this already work for ComboBox and FilteringSelect?

[guest]

I believe ComboBox? and FilteringSelect? do work. I would think TextAreas? could work the exact same way as TextBoxes?. (Show the icon and change color/border if required and user blurs through, or validate is called)

However, radios and checkboxes are more complicated. I would suggest the following:

Create a SelectionGroup? form widget that can validate. It surrounds a group of radios or checkboxes. You could even add some advanced features, such as restricting how many items can be selected. Also, checkboxes should be able to have isValid functions. Here's a contrived Pizza example:

The user has a choice of toppings. They can choose between 1 and 3 toppings. They can only pick one kind of meat.

<div dojoType="dijit.form.SelectionGroup" requireSelected="{min:1,max:3}" errorMessage="You must make between 1 and 3 selections">

<label><input type="checkbox" dojoType="dijit.form.Checkbox" isValid="checkMeatChoices" errorMessage="You can only choose one meat topping!"/>Peperroni</label>

<label><input type="checkbox" dojoType="dijit.form.Checkbox" isValid="checkMeatChoices" errorMessage="You can only choose one meat topping!"/>Sausage</label>

<label><input type="checkbox" dojoType="dijit.form.Checkbox" isValid="checkMeatChoices" errorMessage="You can only choose one meat topping!"/>Salami</label>

<label><input type="checkbox" dojoType="dijit.form.Checkbox"/>Mushrooms</label>

<label><input type="checkbox" dojoType="dijit.form.Checkbox"/>Olives</label>

etc...

</div>

checkMeatChoices simply returns false if the checkbox is checked and more than one meat choice is selected.

So now, when the user checks more than one meat choice, all meat choices are highlighted and next to the checkbox show: "You may only choose one meat topping!"

Also, if they choose more than 3 toppings the whole checkbox group is highlighted in a border and says "You must make between 1 and 3 selections" at the top. If they don't make any choices and try to submit the form, form.validate() is called, and again the SelectionGroup? is highlighted and focused, just like TextBox? elements when you do form.validate()

Also, calling validate on a SelectionGroup? should call validate on each checkbox it the SelectionGroup? itself is valid (requireSelected is not violated).

[nathan]

I think that's a great suggestion - it's kind of along the lines of the _CombinedFormWidget idea discussed at http://www.dojotoolkit.org/forum/dijit-dijit-0-9/dijit-development-discussion/ideas-enhancements-form-widgets

[guest]

TextAreas? are my main concern - to be able to validate one as a required field. Radios / Checkboxes are not as critical, though the ideas above are nice. The thought comes to mind that an Editor field also would be nice to have a required attribute. Also it was mentioned that Combobox/FilteringSelect might already support this - but I'm not sure how.

[bill]

Josh or Nathan, if you want to work on this feel free. That would be great. I'm not opposed to the idea, although not sure sure about the exclamation mark icon on a tall textarea, seems like that would look weird, and also be hard to implement.

[guest]

I might take a stab at at least a "required" attribute for Textarea and the Select type widgets. I don't see the radios/checks as being used quite as often. I used to use tmt:validator http://www.massimocorner.com/libraries/validator/ which handles all these kinds of validations and then some but I don't like the idea of loading even more JS on top of dojo.

FWIW, dojo.validation.check() I believe still exists in dojox.

[bill]

bumping 1.4 tickets to 1.5, and most 1.3 tickets to 1.4

[dante]

+1 from me. Seems like required="true" on Textarea makes a lot of sense.