coldfusiongroupingcoldfusion-9cascadingdropdowncfselect

CFSelect + Bind + Group Not Grouping

I have a CFSELECT tag as below but it doesn't create the <optgroup> tags. How can I archive this?

<cfselect name="name" value="DB_ID" group="DB_Grouping"
display="DB_Description" selected="#Selected_ID#"
bind="cfc:[path_to_CFC]" bindOnLoad="true" style="width:305px;" />

The dropdown loads like this:

<select id="name" name="name">
    <option value="DB_ID_1">DB_Description_1</option>
    <option value="DB_ID_2">DB_Description_2</option>
    <option value="DB_ID_3">DB_Description_3</option>
    <option value="DB_ID_4">DB_Description_4</option>
</select>

instead of:

<select id="name" name="name">
    <optgroup label="DB_Grouping_1">
        <option value="DB_ID_1">DB_Description_1</option>
        <option value="DB_ID_2">DB_Description_2</option>
    </optgroup>
    <optgroup label="DB_Grouping_2">
        <option value="DB_ID_3">DB_Description_3</option>
        <option value="DB_ID_4">DB_Description_4</option>
    </optgroup> 
</select>

Can anyone please help?

Solution

  • You may not like it but the best answer is don't use cfselect. Just use a regular HTML select and use jquery to load the data and build the options and groups. This is why the CF UI stuff should be avoided. As soon as you need to do something slightly outside the norm it makes it too difficult. You'll be better off in the long run because you'll know how to roll your own Ajax requests and build the JavaScript to output the options and you won't be stuck with adobe's way of doing it.