Question

I have a radio group where I need to do some math calculations based on the value of the radio selected, but I also need a way to know my identity value for the SQL record it represents. Normally I would have that stored in the “value” attribute of the radio button.

What I tried to do here is have different ID’s for the same class, and I am trying to figure out how to determine the ID assigned

<input type="radio" class="price" name="price" value="20.00" checked="true" id="1" />
<input type="radio" class="price" name="price" value="385.00" id="2" />
<input type="radio" class="price" name="price" value="504.00" id="3" />

$('.price').change(function() {
calculate();
});

function calculate () {
    var q = $('input#quantity').val();
    var p = $("input[name=price]:checked").val();
    var tot = ((q*p)+parseInt(s));
    $('input#total').val(tot);
};

So in the calculate() function, I get the value but how can I get the ID for the radio button checked? Maybe this is backwards and there is a better way to get my dollar value for the math calculation part and I am open to any suggestions.

TIA – Dan

Answer 1

So, the way you have your HTML right now, you could use this:

var id = $("input[name=price]:checked").attr('id');

BUT!

The id attribute is reserved for the DOM, and on top of that, it can’t shouldn’t start with a number. I might suggest using jQuery.data() instead. Simply add data- to the front of the id attribute you had:

<input type="radio" class="price" name="price" value="385.00" data-id="2" />

And then retrieve the data-id attribute using the following:

var id = $("input[name=price]:checked").data('id');