CODEWITHSUNDEEP
javascriptjquery
Ayrad
Ayrad

Reputation: 4056

jquery removeClass doesn't seem to work

While firstli.hasClass('selected') does work and retrieves the correct element. The removeClass function doesn't seem to remove to the class. When an element is unchecked I would like the first li to be unchecked as well.

Here is the jfiddle (the code is at the bottom)

Note: I want "Select All" to become unchecked when you uncheck one of the other options. 

var firstli = $('.dropdown-menu.inner li').first();
firstli.click(function(event) {   
    if (!firstli.hasClass('selected')) {    
        $('.selectpicker').selectpicker('selectAll');       
    }
    else {
        $('.selectpicker').selectpicker('deselectAll');
    }
    return false;
});

var alllis = $('.dropdown-menu.inner li:not(:first-child)');

alllis.click(function(event) {
    if ($(this).hasClass('selected')) {    
        alert(firstli.hasClass('selected')); //true
        firstli.removeClass('selected');
    }
});

Upvotes: 1

Views: 1784

Answers (1)

Willem Ellis
Willem Ellis

Reputation: 5016

Your problem is with setSelected() rechecking the Select All option. To fix this, I changed that function to the following:

setSelected: function (c, d) {
    if (d) {
        this.$menu.find("li").eq(c).addClass("selected")
    } else {
        this.$menu.find("li").eq(c).removeClass("selected")
        this.$menu.find("li:first-child").removeClass("selected")
    }
}

Basically, if it has to remove the selected class, you know they're not all checked. This works.

http://jsfiddle.net/eC8hF/30/

Upvotes: 2

Related Questions