Question

I am using jQuery 1.4.3.

I have a group of checkboxes like this:

<input type='checkbox' class="Product" value="5">
<input type='checkbox' class="Product" value="2">
<input type='checkbox' class="Product" value="3">

I am getting an element’s index like this:

$(".Product").click(function() {
    // GET PRODUCT DETAILS
    var Idx = $(this).index(".Product");
)};

If you click on the first checkbox, the value of Idx should be zero. If the second box is clicked, the value of Idx should be one. If you click on the third box, Idx will be two.

Now let’s say I want to uncheck the box that was just clicked using its index. How do I refer to an element by the value of its index?

$(".Product").click(function() {
    // GET PRODUCT DETAILS
    var Idx = $(this).index(".Product");
    alert('The index of the checkbox that was clicked was ' + Idx );

    // UNCHECK THE BOX THAT WAS JUST CHECKED -- NOT USING THIS
    $(".Product").index(Idx).attr("checked", false);


)};

This is the line that is incorrect and needs to be fixed:

    // UNCHECK THE BOX THAT WAS JUST CHECKED -- NOT USING THIS
    $(".Product").index(Idx).attr("checked", false);

Can you fix this?

Answer 1

Perhaps try this:

$('.Product').eq(Idx).attr('checked', false);