user3106744
user3106744

Reputation: 23

Enable one option group at a time

<select name="campus">    
    <optgroup label="Northwest">
        <option value="1">Gary</option>
        <option value="2">Valparaiso</option>
        <option value="3">East Chicago</option>
    </optgroup>
    <optgroup label="North Central">
        <option value="4">South Bend</option>
        <option value="5">Elkhart</option>
        <option value="6">Warsaw</option>
    </optgroup>
</select>

I have multiple <optgroup>s in my dropdown. I am using the multiselect plugin. How can I restrict to select only one optgroup selection? That is, when one option in a group is selected, options in other groups should be disabled.

Upvotes: 0

Views: 1040

Answers (2)

Nicholas Hazel
Nicholas Hazel

Reputation: 3740

Please provide the element that will be your event handler. We cannot code further without that.

That is, what is determining if certain items are blocked or not?

Based on the info you provided without knowing your handler...

http://jsfiddle.net/SinisterSystems/3rTkJ/2/

HTML:

<select name="campus" id="selCampus">    
    <optgroup label="Northwest" id="northWest">
        <option value="1">Gary</option>
        <option value="2">Valparaiso</option>
        <option value="3">East Chicago</option>
    </optgroup>
    <optgroup label="North Central" id="northCentral">
        <option value="4">South Bend</option>
        <option value="5">Elkhart</option>
        <option value="6">Warsaw</option>
    </optgroup>
</select>

JS:

$('#selCampus').on('click', function(){
    $('#northCentral').hide();
});

Upvotes: 0

Bic
Bic

Reputation: 3134

It sounds like you want something like this. Based on what you're asking for, how would you go about selecting from a different option group, if all the options are disabled?

$('select').on('change', function () {

    var selectedGroup = $('option:selected', this).parent();

    $('optgroup', this).not(selectedGroup).prop('disabled', true);
});

Here is a Fiddle

Upvotes: 1

Related Questions