1

What I want is the radio button fire the onchange event when i set the checked state via the javascript.

http://jsfiddle.net/4gtCn/

<script>
function check()
{
document.getElementById("red").checked=true
}
function uncheck()
{
document.getElementById("red").checked=false
}
function selectionChanged(){
alert("checked");
}
</script>

What color do you prefer?<br>
<input type="radio" name="colors" id="red" onchange="selectionChanged()">Red<br>
<input type="radio" name="colors" id="blue" onclick="selectionChanged()">Blue<br>
<input type="radio" name="colors" id="green">Green


<button type="button" onclick="check()">Check "Red"</button>
<button type="button" onclick="uncheck()">Uncheck "Red"</button>

thanks everyone for the help. This is a snippet for a larger problem. I am using a 3rd party reporting tool (LogiXml). the only option i have is to change the events, since the rest of the javascript is generated by the tool. So some of the options provided wont help me. So in the above example the moment I click on the button a corresponding event in the radio button should fire.

user1124707
  • 135
  • 1
  • 11
  • It seems to be working for me, make sure you have all your statements terminated with a semicolon. – Popo Jun 26 '13 at 12:42

7 Answers7

1

Is this what you want to do?

<script>
function check()
{
    document.getElementById("red").checked=true;
    selectionChanged();
}
function uncheck()
{
    document.getElementById("red").checked=false
    selectionChanged();
}
   function selectionChanged(){
   alert("checked");
}
</script>

so you can enter the function "selectionChanged()" from clicking on it or by pressing the button.

John b
  • 1,338
  • 8
  • 16
  • +1 for actually making it work, `onchange()` seems of not much help here. would be great to see a solution using `onchange()`! – Ishank Jun 26 '13 at 12:49
0

You can fire the event manually when you are checking/unchecking via JS. Like this...

document.getElementById("red").onchange(); 

WARNING: Pls check the compatibility with other browsers especially IE, else use jQuery to accomplish the same.

mohkhan
  • 11,925
  • 2
  • 24
  • 27
0

You may also invoke the onClick method this way:

document.getElementById("radioButton").click()
Dave H
  • 653
  • 12
  • 22
0

change onclick to onchange for all radio button ,because in your some radio button in onchange and some in onclick

<input type="radio" name="colors" id="red" onchange="selectionChanged()">Red<br>
<input type="radio" name="colors" id="blue" onchange="selectionChanged()">Blue<br>
<input type="radio" name="colors" id="green" onchange="selectionChanged()">Green
Ganesh Rengarajan
  • 2,006
  • 13
  • 26
0

If you want want to run selectionChanged function through onChange event, which when user clicks on calls check() function, the at that case you can call selectionChanged function on check() function directly to make it run.

Please check below code, we have added selectionChanged() on check() function:

<script>
function check()
{
document.getElementById("red").checked=true
selectionChanged();
}
function uncheck()
{
document.getElementById("red").checked=false
}
function selectionChanged(){
alert("checked");
}
</script>

What color do you prefer?<br>
<input type="radio" name="colors" id="red" onchange="selectionChanged()">Red<br>
<input type="radio" name="colors" id="blue" onclick="selectionChanged()">Blue<br>
<input type="radio" name="colors" id="green">Green


<button type="button" onclick="check()">Check "Red"</button>
<button type="button" onclick="uncheck()">Uncheck "Red"</button>
Shreyas
  • 247
  • 1
  • 14
0

Javascript OnChnage() event not works on IE8, So better you use click event in place of change event. see: http://forum.jquery.com/topic/ie8-onchange-onclick-not-firing.

One more interesting thing about change event is that, when you use Jquery's change() function then it will work only when you click to check. not when you click to uncheck. JQuery $(#radioButton).change(...) not firing during de-selection

Community
  • 1
  • 1
Sanjeev Rai
  • 6,721
  • 4
  • 23
  • 33
-1

it seems to be fine. try debugging with firebug and check the console in firebug for any syntax errors.