Chosen: Making a chosen input a required field

[jbrooksuk]

My original markup sets the select to be a required field, however Chosen doesn't seem to comply to that?

[tdm00]

@jbrooksuk did you ever find a solution for this? jQuery Validate doesn't seem to allow me to force the field to be required either.

[CaptainN]

I have a patch to this referenced in #515 and pull request in #900.

[jbrooksuk]

I ended up writing a helper function which performs this check manually on chosen elements. I'll dig it out tomorrow if I can find it, although in the mean time @CaptainN's solution looks good :+1:

[kenearley]

This is a dupe of https://github.com/harvesthq/chosen/issues/515. We wil be following up there. Thanks.

[jbrooksuk]

515 is technically a dupe of this, but yeah okay.

[tripflex]

If you're using Chosen for all select elements, you can use this CSS to change make it visible (to DOM), but no opacity, no height, absolute position.

These CSS selectors target invalid select elements, with one of them targeting multiple adding a 15px margin-top to center it on the multiselect elements.

select:invalid {
    height: 0px !important;
    opacity: 0 !important;
    position: absolute !important;
    display: flex !important;
}

select:invalid[multiple] {
    margin-top: 15px !important;
}

Demo: http://jsfiddle.net/tripflex/2zdeu9oc/