mardi 12 septembre 2017

Looping List Of Checkboxes in Jquery To Match Duplicate Classes

I'm trying to identify if someone checks two checkboxes with the same class.

HTML is here:

<fieldset class="activities">
        <legend>Register for Activities</legend>
        <label><input type="checkbox" name="all"> Main Conference — $200</label>
        <label class="tues_morn"><input type="checkbox" name="js-frameworks"> JavaScript Frameworks Workshop — Tuesday 9am-12pm, $100</label>
        <label class="tues_aft"><input type="checkbox" name="js-libs"> JavaScript Libraries Workshop — Tuesday 1pm-4pm, $100</label>
        <label class="tues_morn"><input type="checkbox" name="express"> Express Workshop — Tuesday 9am-12pm, $100</label>
        <label class="tues_aft"><input type="checkbox" name="node"> Node.js Workshop — Tuesday 1pm-4pm, $100</label>          
        <label><input type="checkbox" name="build-tools"> Build tools Workshop — Wednesday 9am-12pm, $100</label>
        <label><input type="checkbox" name="npm"> npm Workshop — Wednesday 1pm-4pm, $100</label>

      </fieldset>

And here is what I'm trying in jQuery, but i'm getting the alert (You Signed Up For Too Many Morning Classes) when i click any one of the checkboxes. Any ideas?

var $activities = $('.activities > label');

//Activities
var tuesMorn = 0
var tuesAft = 0
$activities.each(function(){
    var activityClass = ($(this).attr("class"));
    $activities.change(function(){
        if (activityClass === 'tues_morn'){
            tuesMorn += 1;
        } else if (activityClass === 'tues_aft'){
            tuesAft +=1;
        } 
    if (tuesMorn > 1) {
        alert("You Signed Up For Too Many Morning Classes");
    } else if (tuesAft > 1) {
        alert ("You Signed Up For Too Many Aft Classe")
    } 
   });
});

Aucun commentaire:

Enregistrer un commentaire