Dojo - Filtering Select - How to add a blank option '-' that allows submission

Question

Hello,

Been trying to fix this for a while now. I have loads of Dojo Filtering Select elements in my form. I need them to have a blank option which should be selected by default. Here is an example (of a normal <select> structure) that I want to emulate:

<select>
    <option value="">-</option>
    <option value="foo">Bar</option>
</select>

At present when I load up my filtering selects that have the options set as above, there is no element selected. This in turn disables form submission. This is totally unusable for my end users as they would have no idea why the form is not working. The selects are not even required fields.

Anyone having a similar problem, or even better got a solution?

Cheers if you can help :)

Answer 1

The problem lies in the way the FilteringSelect stores it's data. It keeps them in a data store that requires an identifier and a label. You can't quite emulate the functionality of a plain select because of this.

You can 'get around' this by putting a fake item in your options with a value of 'XXXX' (or another fake value).

<select>
    <option value="XXXX">-</option>
    <option value="foo">Bar</option>
</select>

One downside of this kludge is that you need to change your validation functions to look for this fake value (instead of an empty value).

I set up a test on jsbin.com where you can see it in action.