CODEWITHSUNDEEP
javascriptjqueryhtml
Bob
Bob

Reputation: 8714

The state of checkbox looks updated, but it is not updated actually

I have strange issue. I am developing something for Magento. I added link "Select all categories" and add a jQuery event to check all checkboxes when I click on it. It works great, but somehow the html is not updated and Magento can't see that all inputs are selected. But when I manually click on a checkbox, it updates html (I am looking at the console) and Magento save button works just fine.

How to resolve this issue? I am not sure what else should I do to perform updating html. It look like it works (checkboxes are selected), but please take a look at the console and html. Html must be updated.

I created jsfiddle: here

Upvotes: 0

Views: 131

Answers (5)

Vitalii Maslianok
Vitalii Maslianok

Reputation: 1631

try this:

.attr('checked', 'checked');

Upvotes: 2

Laurent Brieu
Laurent Brieu

Reputation: 3367

You can use something like : 

// custom jQuery added
jQuery(function() {
    var to_check = false;       
    jQuery(".select-all-categories").click(function(){
        if (!to_check)
            to_check = true;
        else
            to_check = false;

        jQuery("#banner-categories input[type=checkbox]").each(function(){
            if (!to_check)      
                jQuery(this).removeAttr("checked");
            else  
                jQuery(this).attr("checked","checked");
        });          
        return false;
    });
});

Code can be optimized

Upvotes: 1

Bob
Bob

Reputation: 8714

I figured it out. It was Magento issue. Magento doesn't use that form, it uses hidden input and collects selected checkboxes. Will upvote all answers anyway. Thanks

Upvotes: 1

David
David

Reputation: 435

Did you try prop('checked', true); instead of prop('checked', 'checked'); ? That's what I see in all the examples.

Upvotes: 1

Nelson Benítez León
Nelson Benítez León

Reputation: 50623

Just check all checkboxes, like this .

Your is(':checked') IF statement seems wrong as it should be enclosed on an .each() so it applies to all checkboxes, try the more simple approach on the fiddle I linked.

Upvotes: 1

Related Questions