radio button in html

Question

I am trying to get the selected value from the radio button this is the jsfiddle.

HTML :

<table>
    <tr>
        <td> Is Reference Number Available</td>
         <td> <input type="radio" name="group1" value="yes" onchange="isReferenceNumberAvailable()"> Yes</input> 
              <input type="radio" name="group1" value="no" onchange="isReferenceNumberAvailable()"> No </input>
        </td>
    </tr>

</table>

javascript :

function isReferenceNumberAvailable()
{    
        var test = document.getElementsByName("group1");

        for(var elem in test)
        {
            if(test[elem].checked)
            {
                alert(test[elem].value);  // got the element which is checked      
                if(test[elem].value=="yes")
                    alert("Need to create Reference select box");
                else if(test[elem].value=="no")
                    alert("don't create ");      
            }
        }
}

But when I select the radio button i get the following :

Uncaught ReferenceError: isReferenceNumberAvailable is not defined

You need to select the "No wrap - in ``" option from the dropdown on the left: http://jsfiddle.net/9WX3D/1/ — Colin Brock, Dec 12 '13 at 05:34
possible duplicate of [Function doesn't execute from an onclick inside the html](http://stackoverflow.com/questions/20021628/function-doesnt-execute-from-an-onclick-inside-the-html) — Colin Brock, Dec 12 '13 at 05:40

score 1 · Answer 1 · answered Dec 12 '13 at 05:45

1

Your code is working only error is javascript place error see this demo

answered Dec 12 '13 at 05:45

Amit

15,217
8
46
68

Pandiyan Cool · Accepted Answer · 2013-12-12T06:00:15.927

Check out this

http://jsfiddle.net/9JQU6/

function isReferenceNumberAvailable()
{    
        var test = document.getElementsByName("group1");

        for(var elem in test)
        {
            if(test[elem].checked)
            {
                alert(test[elem].value);  // got the element which is checked      
                if(test[elem].value=="yes")
                    alert("Need to create Reference select box");
                else if(test[elem].value=="no")
                    alert("don't create ");      
            }
        }
}

Reason

enter image description here

score 1 · Answer 3 · answered Dec 12 '13 at 05:51

1

The problem is only that its not getting linked in fiddle, it works when placed inside script tags within your HTML see Check this

<script> Within this together with html its fine </script>

answered Dec 12 '13 at 05:51

tariq

2,193
15
26

score 0 · Answer 4 · answered Dec 12 '13 at 05:53

0

Use following script using jquery

$(document).ready(function(){
$('input:radio').click(function(){
alert$('input[name=group1]:checked').val()); // get selected radio button value
// do what you need here
});
});

answered Dec 12 '13 at 05:53

sumit

332
2
7

Roko C. Buljan · Answer 5 · 2013-12-12T06:23:49.643

http://jsbin.com/anAyIWUN/1/edit

^{Try always to put all your JS before the closing </body> tag.}

Regarding your HTML and scripts I would go with something nicer and simpler:

<table>
    <tr>
        <td> Is Reference Number Available</td>
         <td>
           <input type="radio" name="group1" value="yes"> Yes
           <input type="radio" name="group1" value="no"> No 
        </td>
    </tr>
</table>

JS:

var $el = document.getElementsByName("group1"),
    msg = {"yes":"Need to create Reference select box", "no":"Don't create"};

function getVal(){    
   if(this.checked) alert( msg[this.value] );
}

for(var i=0; i<$el.length; i++)
    $el[i].onchange = getVal;

radio button in html

5 Answers5