Question

I have web form markup as follows:

<input type="radio" value="0" name="fieldSelection[1]" class="optionA">
<input type="radio" value="0" name="fieldSelection[1]" class="optionB">
<input type="radio" value="0" name="fieldSelection[1]" class="optionC">
<input type="radio" value="0" name="fieldSelection[2]" class="optionA"><!--want to check this one-->
<input type="radio" value="0" name="fieldSelection[2]" class="optionB">
<input type="radio" value="0" name="fieldSelection[2]" class="optionC">
<input type="radio" value="0" name="fieldSelection[3]" class="optionA">
<input type="radio" value="0" name="fieldSelection[3]" class="optionB">
<input type="radio" value="0" name="fieldSelection[3]" class="optionC">

How can I set only one of the boxes to checked -- example, check button optionA for fieldSelection[2]?

Here is what I have, but obviously it checkes all 3 buttons:

$('.optionA').prop('checked', true);
Was it helpful?

Solution

You can use the attribute selector:

$('input.optionA[name="fieldSelection[2]"]').prop('checked', true);

Fiddle

OTHER TIPS



Try something like this:

function setChecked(string fieldSelection, string className)
   {
      if ( $.trim($(this).attr('name')) == $.trim(fieldSelection) )
       {
        $("." + className ).prop('checked', true);
       }
    }

Is this what you are looking for?

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top