Question

I need to set ‘s:textarea’ value which is selected in ‘s:radio’ button.

I am currently using the code below to do it. But it always set the ‘In test’ value in ‘s:textarea’ which is the first value in ‘s:radio’ button list.

function handleCommentChange()
{
    var comment = document.getElementById('comment');

    var radioComment1 = document.getElementById('radio1');

    comment.value = radioComment1.value;

}


<td>
  <s:radio id="radio1" name="radio1" list="#{'In test':'In test','Defect':'Defect','Pass':'Pass', 'Fail':'Fail' }"
     onclick="javascript:handleCommentChange();" ></s:radio>
  <br></td>

<td><s:textarea id="comment" name="comment" cols="25" rows="5"></s:textarea></td>

Please tell how I can set the selected value of ‘s:radio’ button in ‘s:textarea’.

Answer 1

Pass a reference to the clicked radio in to your handleCommentChange() function. You can pass this, which will give the function a reference to the radio element and let you access all of its properties, etc., or you can pass this.value directly and have the function assign that string to your textarea. I prefer to pass this to allow for future expansion needing access to other properties:

function handleCommentChange(aRadio) {
   document.getElementById('comment').value = aRadio.value;
}


<s:radio ... onclick="handleCommentChange(this);">

The other way to do it is to setup a loop to go through each radio button and check which one has its checked property set to true.