I have one group of checkboxes and one group of radio buttons. They are as follows:
PRIMARY CHECKBOXES
<input class="filter" type="checkbox" id="theme1" name="theme" value="adventure">
<label for="theme1">Adventure</label>
<input class="filter" type="checkbox" id="theme2" name="theme" value="attraction">
<label for="theme2">Attraction</label>
<input class="filter" type="checkbox" id="theme3" name="theme" value="leisure">
<label for="theme3">Leisure</label>
<input class="filter" type="checkbox" id="theme4" name="theme" value="culture">
<label for="theme4">Culture</label>
<input class="filter" type="checkbox" id="theme5" name="theme" value="nature">
<label for="theme5">Nature</label>
SECONDARY RADIO BUTTONS
<input class="filter combo" type="radio" id="combo1" name="combo">
<label for="combo1">Adv Att</label>
<input class="filter combo" type="radio" id="combo2" name="combo">
<label for="combo2">Cul Att</label>
<input class="filter combo" type="radio" id="combo3" name="combo">
<label for="combo3">Adv Nat</label>
<input class="filter combo" type="radio" id="combo4" name="combo">
<label for="combo4">Att Lei</label>
JQUERY CODE
$(':checkbox').change(function() {
if ($('#theme1').is(":checked") && $('#theme2').is(":checked")) {
$('#combo1').prop('checked', true);
}
})
$(':checkbox').change(function() {
if ($('#theme1').is(":checked")) {
$('#combo2').prop('checked', true);
}
})
By doing the above, there is a slight problem. When I select the Adventure checkbox, the Cul Att radio button gets highlighted. But, when I check the Attraction checkbox along with Adventure checkbox, I'd want the radio button to now be on Adv Att. I have this as a condition on my jquery code above, but it still won't work. What am I doing wrong? Any help is much appreciated!
Aucun commentaire:
Enregistrer un commentaire