0

I have some values from a JSON ARRAY. The values are Value1,Value2,Value3 and I have a checkbox in HTML with an ID the same as the Value.

I want to auto-check the checkbox which has the value from the JSON Array.

I tried to do this with below code:

var OtherPay = response.OtherPay;
var benefit = OtherPay.split(",");
var sum = benefit.length;

for (var i = 0; i < sum; i++) {      
    $('#'+benefit[i]).attr('checked',true);
}
Nope
  • 22,147
  • 7
  • 47
  • 72
bramadwitra
  • 97
  • 1
  • 12
  • what happens with your code? – guradio Sep 27 '17 at 08:19
  • Could you show us the HTML please – DenseCrab Sep 27 '17 at 08:19
  • Ok, but what exactly is not working? For checking a checkbox use `$('#'+benefit[i]).prop('checked', true)` – kevinSpaceyIsKeyserSöze Sep 27 '17 at 08:19
  • My checkbox doesn't check @kevinSpaceyIsKeyserSöze – bramadwitra Sep 27 '17 at 08:21
  • @bramadwitra try my edit – kevinSpaceyIsKeyserSöze Sep 27 '17 at 08:22
  • _"To retrieve and change DOM properties such as the `checked`, `selected`, or `disabled` state of form elements, use the [`.prop()`](https://api.jquery.com/prop/) method"_ (from: https://api.jquery.com/attr/) – Andreas Sep 27 '17 at 08:23
  • You can do `$('#'+benefit[i])[0].checked = true;` – Nope Sep 27 '17 at 08:25
  • Okay done, one of my Id Checkboxes has a space. I try to delete a space, it works. My code fully works... Thanks @kevinSpaceyIsKeyserSöze – bramadwitra Sep 27 '17 at 08:27
  • Your code doesnt work for me... @Fran then tell me why my question duplicate? – bramadwitra Sep 27 '17 at 08:36
  • @bramadwitra your question is a duplicate because it has been answered on SO how to check a checkbox with jQuery. – kevinSpaceyIsKeyserSöze Sep 27 '17 at 08:49
  • different case between my problem and the reference @kevinSpaceyIsKeyserSöze – bramadwitra Sep 27 '17 at 09:41
  • The use case can be a million different cases. If your problem was that you tried accessing a DOM property with jQuery `attr` which targets HTML Attributes instead of `prop` which targets DOM properties the problem was the same and required the same solution. Even if in addition you had spacing issues in your identifiers. For that there are most likely other duplicate SO posts as well. – Nope Sep 27 '17 at 15:19
  • However, if off course `attr` worked for you and the issue was only the spacing in your identifier then you are correct, the duplicate is for another SO post instead. What was the fix in the end? – Nope Sep 27 '17 at 15:37

2 Answers2

1

This should work if each checkbox element has an id attribute with that value but I think you should use 

$('#' + benefit[i]).prop('checked', true);

if you are using a recent jQuery version

Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
jmtalarn
  • 1,513
  • 1
  • 13
  • 16
  • Why will `prop` work and why does it matter if the elements has an id? – Nope Sep 27 '17 at 08:30
  • `prop`is the method jQuery library uses to modify properties of jQuery objects http://api.jquery.com/prop/ The id requirement is because the selector you are using uses the #. This means that you query for an element in your document with that id. You should check it with the CSS selector definitions https://www.w3schools.com/cssref/css_selectors.asp – jmtalarn Sep 27 '17 at 14:59
  • My point was that it would have been nice for the answer to include some explanation not just "Do it this way". - The way I understand it is that properties are defined by the DOM, unlike Attributes which are defined by HTML. Not all attributes have a 1 to 1 mapping to a property. `Checked=checked` is the Attribute and when using `attr` that is what is changed, however, that is mapped to the `defaultChecked` property and not the `checked` property. To change that you need to use `prop` instead which will target the `checked` property. Rule of thumb, use `prop` to explicitly target properties. – Nope Sep 27 '17 at 15:12
0

try using 

$('#'+benefit[i]).prop('checked',true);

as said here: Setting "checked" for a checkbox with jQuery?

Daniel Maiochi
  • 607
  • 6
  • 16