CODEWITHSUNDEEP
javascriptjquery
Mona Coder
Mona Coder

Reputation: 6316

How to update checkboxes state based on an array?

I am working on the following code. Why am I not able to update the chekbox states based on selected array?

var selected = [134,135,136,137,138,139,140,141,142,143,144];
$.each(selected, function(index, value){
  $("input[type='checkbox'][value"+ value.member_key+ "]").prop("checked", true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="vehicle" value="133">133<br>
<input type="checkbox" name="vehicle" value="134">134<br>
<input type="checkbox" name="vehicle" value="135">135<br>
<input type="checkbox" name="vehicle" value="136">136<br>
<input type="checkbox" name="vehicle" value="137">137<br>
<input type="checkbox" name="vehicle" value="138">138<br>
<input type="checkbox" name="vehicle" value="139">139<br>
<input type="checkbox" name="vehicle" value="140">140<br>
<input type="checkbox" name="vehicle" value="141">141<br>
<input type="checkbox" name="vehicle" value="142">142<br>
<input type="checkbox" name="vehicle" value="143">143<br>
<input type="checkbox" name="vehicle" value="144">144<br>
<input type="checkbox" name="vehicle" value="145">145<br>
<input type="checkbox" name="vehicle" value="146">146<br>

Upvotes: 0

Views: 43

Answers (3)

Mamun
Mamun

Reputation: 68933

There is no property named member_key on the passed value. Since you are implementing .each() on a number array, in each iteration the callback function will take the number itself as the second parameter. Hence, simply use value:

var selected = [134,135,136,137,138,139,140,141,142,143,144];
 $.each(selected, function(index, value){
  $("input[type='checkbox'][value="+value+"]").prop("checked", true);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="vehicle" value="133">133<br>
<input type="checkbox" name="vehicle" value="134">134<br>
<input type="checkbox" name="vehicle" value="135">135<br>
<input type="checkbox" name="vehicle" value="136">136<br>
<input type="checkbox" name="vehicle" value="137">137<br>
<input type="checkbox" name="vehicle" value="138">138<br>
<input type="checkbox" name="vehicle" value="139">139<br>
<input type="checkbox" name="vehicle" value="140">140<br>
<input type="checkbox" name="vehicle" value="141">141<br>
<input type="checkbox" name="vehicle" value="142">142<br>
<input type="checkbox" name="vehicle" value="143">143<br>
<input type="checkbox" name="vehicle" value="144">144<br>
<input type="checkbox" name="vehicle" value="145">145<br>
<input type="checkbox" name="vehicle" value="146">146<br>

Upvotes: 3

Jordan Epstein
Jordan Epstein

Reputation: 317

Other answers are commenting on 

value.member_key

I'd assume this is an error from copying the code to stackoverflow. I would guess the part you are missing in your actual code is the equals sign between the word "value" and its actual value.

your code will produce

[value133]

whereas you need

[value=133]

Upvotes: 0

Taplar
Taplar

Reputation: 24965

var selected = [134,135,136,137,138,139,140,141,142,143,144];
 $.each(selected, function(index, value){
                                       //include the = and fix the value being compared
              $("input[type='checkbox'][value="+ value+ "]").prop("checked", true);
         })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="vehicle" value="133">133<br>
<input type="checkbox" name="vehicle" value="134">134<br>
<input type="checkbox" name="vehicle" value="135">135<br>
<input type="checkbox" name="vehicle" value="136">136<br>
<input type="checkbox" name="vehicle" value="137">137<br>
<input type="checkbox" name="vehicle" value="138">138<br>
<input type="checkbox" name="vehicle" value="139">139<br>
<input type="checkbox" name="vehicle" value="140">140<br>
<input type="checkbox" name="vehicle" value="141">141<br>
<input type="checkbox" name="vehicle" value="142">142<br>
<input type="checkbox" name="vehicle" value="143">143<br>
<input type="checkbox" name="vehicle" value="144">144<br>
<input type="checkbox" name="vehicle" value="145">145<br>
<input type="checkbox" name="vehicle" value="146">146<br>

Upvotes: 0

Related Questions