CODEWITHSUNDEEP
javascriptjqueryhtmlcssmaterial-design
the preacher
the preacher

Reputation: 377

change checkbox attr if checkbox is checked in material io

hi i have a button to clear all filters when clicked on, and i want the check boxes that are checked to be unchecked on that button click, the problem i'm facing is i'm using material io and these methods doesn't seem to work on it.

$('#clear-filters').on('click', function () {
    $('input:checkbox').attr('checked',false);
});

or

$("#clear-filters").click(function(){
    $("input:checkbox").removeAttr('checked');

});

and this is the checkbox im using:

<div class="mdc-form-field">
    <div class="mdc-checkbox">
         <input type="checkbox" class="mdc-checkbox__native-control" id="checkbox-1" />
         <div class="mdc-checkbox__background">
             <svg class="mdc-checkbox__checkmark" viewBox="0 0 24 24">
                  <path class="mdc-checkbox__checkmark-path" fill="none d="M1.73,12.91 8.1,19.28 22.79,4.59" />
             </svg>
             <div class="mdc-checkbox__mixedmark"></div>
         </div>
         <div class="mdc-checkbox__ripple"></div>
    </div>
    <label for="checkbox-1">sth</label>
</div>

Upvotes: 1

Views: 585

Answers (2)

Ivan
Ivan

Reputation: 433

you can use prop to uncheck checkboxes . This should work for you

$('#clear-filters').on('click', function () {
  $('input:checked').prop('checked',false);
});

Upvotes: 2

chuu
chuu

Reputation: 128

fix input:checkbox to input [type=checkbox]

$("input[type=checkbox]").attr('checked',false);

//or


$("input[type=checkbox]").removeAttr('checked');

If you want to select checked checkbox,

$("input:checked").removeAttr('checked');

//or

$("input[type=checkbox]:checked").removeAttr('checked');

``

Upvotes: 1

Related Questions