on Click event for checkbox in Javascript

Question

I have a table with following format :

<tbody id="ggwp">
    <tr class="r123 disable-it">
        <td>
            <input  type="checkbox" name="item" class="row" statusid="1234">
        </td>
    </tr>   
    <tr class="r124">
        <td>
            <input  type="checkbox" name="item" class="row" statusid="1235">
        </td>
    </tr> 
    <tr class="r125 disable-it">
        <td>
            <input  type="checkbox" name="item" class="row" statusid="1236">
        </td>
    </tr>
</table>

Now, I want to call perform some action whenever user will click on checkbox of the rows with 'disable-it' set in the classname. Also the event should be unfired when user will uncheck the checkbox.

Inshort, whenever user will click on checkbox of the rows with classnames ="r123 disable-it" and "r125 disable-it" ; some action must be performed and when user will unclick the checkbox, the event should be unfired/rolled back again.

How can I achieve this ? Thanks in advance for reading :)

This is the kind of thing jQuery excels at. JQuery uses selectors that make this easy — Brennan
– Brennan, Commented Sep 3, 2014 at 5:45

Gowtham Selvaraj · Accepted Answer · 2014-09-03 06:07:53Z

1

check if the check box row has class 'disable-it' and performs action

$(document).on("click",".row",function(e) {
    //Checks if the row has class disable-it
    if($(this).parent().parent().hasClass('disable-it')){
        if($(this).prop('checked')){
            //some action can be performed 
            alert('checked');
        }else{
            //unfired/rolled back again.
            alert('rollback');
        }
    }
});

answered Sep 3, 2014 at 6:07

Gowtham Selvaraj

4781 gold badge5 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Techy · Accepted Answer · 2014-09-03 05:50:19Z

0

Try this

$(".row").change(function() {

if(this.checked){
    //write your code
}
else{
    //write your code
   }
});

answered Sep 3, 2014 at 5:50

Techy

2,6547 gold badges47 silver badges89 bronze badges

2 Comments

Techy Over a year ago

why did you downvoted??? Tell me the issue I have,so that I can understand what's the issue?

Dennis Meng Over a year ago

Not the downvoter, but I have a guess: there's a decently-sized group of people who aren't particularly happy with answers that are only code or "try this:" then code. It's highly unlikely that you can't add at least a little explanation as to why your specific approach is the right way to go.

Janani M · Accepted Answer · 2014-09-03 05:56:10Z

0

Check this fiddle

$('input[type=checkbox]').click(function(){
    //alert('check');
      if($(this).is(":checked"))
      {
          $(this).parent().parent().addClass('disable-it');
      }
    else if(!$(this).is(":checked"))
      {
          $(this).parent().parent().removeClass('disable-it');
      }
});

answered Sep 3, 2014 at 5:56

Janani M

4233 silver badges14 bronze badges

Collectives™ on Stack Overflow

on Click event for checkbox in Javascript

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related