Domanda

I'm trying to detect whether a particular group in my drop-down form field is selected so I can disable a check box but I can't quite work out the best way to select the whole group so if in the future that group expands it will still count all within the group. I've added the optgroup of tenancy for all the ones within the group

Here's the JSFIDDLE so far. Here's the code I have currently:

jQuery:

var thisVar = $('.QuickSearchProperties option:selected').val();

$('.QuickSearchProperties')on('change', function(){
    if(thisVar == 'ALLTEN', 'ALLTENUK', 'ALLTENOVERSEAS'){
       $('.ExcTen').addClass('hide');
    }else{
        $('.ExcTen').addClass('hide');
    }
});

HTML:

<form>
    <select name="QuickSearchProperties" class="QuickSearchProperties">
            <option value="a1" optGroup="Spain">Costa Del Sol</option>
            <option value="a2" optGroup="Spain">Almeria</option>
            <option value="a3" optGroup="Spain">Costa Blanca</option>
            <option value="a4" optGroup="Turkey">Turunc</option>
            <option value="a5" optGroup="Wales">Anglesey</option>
            <option value="a5" optGroup="Wales">Pembrokeshire</option>
            <option value="ALLTEN" optGroup="Tenancy">All Tenancy properties</option>
            <option value="ALLTENUK" optGroup="Tenancy">UK Tenancy properties</option>
            <option value="ALLTENOVERSEAS" optGroup="Tenancy">Overseas Tenancy properties</option>
    </select><br/><br/>

    <span class="ExcTen"><input type="checkbox" name="tenancy" value="1" />Exclude Tenancy </span>
</form>

CSS:

.hide{display:none;}
È stato utile?

Soluzione

If you need to hide the checkbox if any option of the Tenancy group is selected, you have to do like this:

$('.QuickSearchProperties').on('change', function(){
    if($(this).find("option:selected").attr("optGroup") == "Tenancy"){
        $('.ExcTen').addClass('hide');
    } else {
        $('.ExcTen').removeClass('hide');
    }
});

Check the Demo Fiddle

Altri suggerimenti

$('.QuickSearchProperties').on('change', function(){
    if(['ALLTEN', 'ALLTENUK', 'ALLTENOVERSEAS'].indexOf($(this).val()) > -1){
        $('.ExcTen').addClass('hide');
    }else{
        $('.ExcTen').removeClass('hide');
    }
});
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top