get each value of the same data-attribute

Question

I need to get the value in each data-attribute and assign that value to a variable and then I want to pass that variable as an argument in a function (I didn't write the function or the html but have to use it). The data-attribute value is dynamically generated based on the row and column of the table from a different function.

I thought I could do something like this:

priceIndex = $(this).attr("data-priceIndex");

$(this) is the parent tableCell.

And then pass the priceIndex variable to the function ie

<tr><td class="tblProduct selectProduct" data-priceIndex="0_0">
    <div class="priceArea" data-priceIndex="0_0">
        <button class="okButton origProduct" onclick="goToCart(priceIndex, '', true, false)"></button>
    </div>
</td>
<td class="tblProduct selectProduct" data-priceIndex="0_1">
    <div class="priceArea" data-priceIndex="0_1">
        <button class="upgradeButton upgrdProduct" onclick="goToCart(priceIndex, '', false, false)"></button>
    </div>
</td></tr>

But that gives me the same value for all data-priceIndex . Why is that happening? How can I get the value of each data-attributes? Please tell me what I am doing wrong and how to correct. Thanks.

.

Answer 1

Dont know what you expect but i think you should rather omit the parameter and retrieve the value in the goToCart function or "wrap" it, the way you try priceIndex will always have the same value no matter what button you click:

<button class="upgradeButton upgrdProduct" onclick="goToCartWrap('',true,false)"></button>

and the function:

function goToCartWrap(s,b1,b2){
 priceIndex = $(this).parent().attr("data-priceIndex");
 goToCart(priceIndex, s, b1, b2)
}