jQuery checkbox disable and add class

Question

I have a table which have list of rows and every row have two checkboxes what I am trying to do is when someone check on check box it send request to server using ajax and reponsev with data if it pass it change the tr color to green if fail it change to red..I am done with this step

Now I want when it is success it should enable other check box which is on the same tr so now user can process with the second step.

$("#SendReview").click(function() {

  var selected = "";
  $('.ReviewForm').each(function() {
    selected = selected + "," + $(this).attr('id');
  });

  $.ajax({
    url: '@Url.Action("VerifyFormRquest", "Results")',
    type: "POST",
    data: {
      scanid: selected
    },
    success: function(data, textStatus, jqXHR) {
      alert(data.success);

      data.success.split(',').forEach(function(c) {
        if (c != "") {
          var m = $('#example tr:has(td:contains(' + c + '))').css('background-color', 'lightgreen');
        }
      });
    },
    error: function(jqXHR, textStatus, errorThrown) {}
  });
});

<table id="example">
  <tr id="1000000107">
    <td>
      <input type="checkbox" id="J15000001" scanid="1000000103" onclick="call()" disabled="disabled" value="1000000103" class="ELOchecked">
    </td>
  </tr>
  <tr id="1000000107">
    <td>
      <input type="checkbox" id="J15000012" scanid="1000000107" disabled="disabled" value="1000000107" class="ELR">
    </td>
  </tr>
</table>

He said what he is trying to do. He wants to enable the second checkbox on success of his AJAX request. — Omar Himada, Dec 05 '17 at 20:44
you need to implement the call() function, that has an ajax call. inside the ajax call, if success enable the other checkbox and whatever you need, if fails add you code into the error function of the ajax — tiborK, Dec 05 '17 at 20:45

score 1 · Answer 1 · answered Dec 05 '17 at 20:41

1

You can do this by using the prop method.

$("#myOtherCheckbox").prop("disabled", false);

If you want to add a class to it as well:

$("#myOtherCheckbox").prop("disabled", false).addClass("someClass");

answered Dec 05 '17 at 20:41

Omar Himada

2,540
1
14
31

Not mine .. but `$("#myOtherCheckbox")` isn't really the correct selector to do this... _I have a table which have list of rows and every row have two checkboxes_ which line your selector will target ? – Zakaria Acharki Dec 05 '17 at 20:49
what i did now i add labid as class in my class and then $('.' + c).prop('disabled', false); thanks!! – ZCoder Dec 05 '17 at 20:50

Muhammad Omer Aslam · Answer 2 · 2017-12-05T21:02:34.827

1

you should use

("#J15000012").prop("disabled",false);

to check the checkbox rather than using the .removeAttr as it does not set the value to false as of jquery 3

edited Dec 05 '17 at 21:02

answered Dec 05 '17 at 20:43

Muhammad Omer Aslam

22,976
9
42
68

1

He is trying to enable the checkbox, not check it. – Omar Himada Dec 05 '17 at 20:43
1

yes you are right I overlooked `enabled` as `checked` @Adosi – Muhammad Omer Aslam Dec 05 '17 at 20:47
1

what i did now i add labid as class in my class and then $('.' + c).prop('disabled', false); thanks!! – ZCoder Dec 05 '17 at 20:50
that is the right way to do as `.removeattr` does not set property to false anymore `.prop` is more efficient – Muhammad Omer Aslam Dec 05 '17 at 20:54

score 1 · Answer 3 · edited May 06 '18 at 13:07

1

Since you already have the pattern to get the td you could get the next one using next('td'):

var current_td = $('#example td:contains('+ c +')');

//If the current td found get the next one and remove the disabled property
if( current_td.length > 0 ){
    current_td.next('td').prop('checked',false);
}

edited May 06 '18 at 13:07

halfer

19,824
17
99
186

answered Dec 05 '17 at 20:45

Zakaria Acharki

66,747
15
75
101

1

Using `.prop` is more preferred in this case. See https://stackoverflow.com/questions/6169826/propchecked-false-or-removeattrchecked – Omar Himada Dec 05 '17 at 20:46
what i did now i add labid as class in my class and then $('.' + c).prop('disabled', false); thanks!! – ZCoder Dec 05 '17 at 20:50
As of jQuery 3, `removeAttr` does not set the corresponding property to `false` anymore using `.prop` is the correct way to set property to true or false – Muhammad Omer Aslam Dec 05 '17 at 20:55
1

Thanks @MuhammadOmerAslam .. already mentioned in the first comment. – Zakaria Acharki Dec 05 '17 at 21:16

jQuery checkbox disable and add class

3 Answers3