Question

I am using jQuery 1.7.1

I am trying to access several items on a page with microdata attribute “data-prodid”. I am told that I should be using jQuery’s “data” property, but I can’t get it to work correctly.

<input type="checkbox" data-prodid="12345">

On a click event, the checkbox is unchecked:

// UNCHECK ITEM IN LIST
var Product_ID = $(this).data("prodid");
$(".Product[data-prodid="+Product_ID+"]").attr("checked", false);

How do I rewrite these so that something like this works using jQuery’s “data” attribute?

// UNCHECK ITEM IN LIST
var Product_ID = $(this).data("prodid");
$(".Product").data("prodid").eq(Product_ID).data("checked", false);
$(".Product").data("prodid", Product_ID).attr("checked", false);

Is there really a right way or a wrong way to do this?

Answer 1

This sounds like a perfect case for using the filter method.

var productID = $(this).data("prodid");
var $relatedProducts = $('.product').filter(function() { 
  return $(this).data("prodid") == productID;
});
$relatedProducts.attr("checked", false);

Example fiddle