Closed Bug 150936 Opened 23 years ago Closed 23 years ago

checked property of radio buttons is not exclusive in forms in dom handlers

Categories

(Core :: Layout: Form Controls, defect)

x86
Windows NT
defect
Not set
major

Tracking

()

RESOLVED DUPLICATE of bug 14445

People

(Reporter: prasad_khambete, Assigned: john)

Details

multiple radio buttons show checked property as true inside a dom handler (for example an onclick handler for a radio button) Here is the test case: <html> <head> </head> <title> Testing Radio Button behavior </title> <body> <center> Testing Radio Button behavior </center><BR> <script language="javascript"> <!-- function handle_click( btn ) { document.myform.txtout.value += String(btn) + " Click Happened\n"; document.myform.txtout.value += "---- Values Before --\n"; for (i=0; i<document.myform.my_radio.length; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } document.myform.my_radio[3].checked = true; document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } } function handle_focus( btn ) { document.myform.txtout.value += String(btn) + " Focus Happened\n"; document.myform.txtout.value += "---- Values --\n"; for (i=0; i<document.myform.my_radio.length; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } //document.myform.my_radio[3].checked = true; /*document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } */ } function handle_mouse( btn ) { return; document.myform.txtout.value += String(btn) + " Mouseover Happened\n"; document.myform.txtout.value += "---- Values --\n"; for (i=0; i<document.myform.my_radio.length; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } document.myform.my_radio[2].click(); document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } } function handle_oclick( btn ) { document.myform.txtout.value += String(btn) + "...\n"; return; document.myform.txtout.value += "---- Values Before --\n"; for (i=0; i<4; i++) { if ( document.other_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } document.other_radio[0].checked = true; document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.other_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } } --> </script> <form name="myform" > <BR> <BR> <div id="a" style="color:red"> <input name="my_radio" type="radio" value="Radio1" onclick ="handle_click(1);" onfocus="handle_focus(1);" onmouseover="handle_mouse(1);" >TT1</input><BR> <input name="my_radio" type="radio" value="Radio2" checked onclick ="handle_click(2);" onfocus="handle_focus(2);" onmouseover="handle_mouse(2);" >TT2</input><BR> <input name="my_radio" type="radio" value="Radio3" onclick ="handle_click(3);" onfocus="handle_focus(3);" onmouseover="handle_mouse(3);" >TT3</input><BR> <input name="my_radio" type="radio" value="Radio4" onclick ="handle_click(4);" onfocus="handle_focus(4);" onmouseover="handle_mouse(4);" >TT4</input><BR> </div> <textarea name ="txtout" rows=20 value="" style="height:800; width:800" > </textarea> </form> <input name="other_radio" type="radio" value="ORadio1" onclick ="handle_oclick (5);" >TO1</input><BR> <input name="other_radio" type="radio" value="ORadio2" checked onclick ="handle_oclick(6);" >TO2</input><BR> <input name="other_radio" type="radio" value="ORadio3" onclick ="handle_oclick (7);" >TO3</input><BR> <input name="other_radio" type="radio" value="ORadio4" onclick ="handle_oclick (8);" >TO4</input><BR> </body> </html>
<html> <head> </head> <title> Testing Radio Button behavior </title> <body> <center> Testing Radio Button behavior </center><BR> <script language="javascript"> <!-- function handle_click( btn ) { document.myform.txtout.value += String(btn) + " Click Happened\n"; document.myform.txtout.value += "---- Values Before --\n"; for (i=0; i<document.myform.my_radio.length; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } document.myform.my_radio[3].checked = true; document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } } function handle_focus( btn ) { document.myform.txtout.value += String(btn) + " Focus Happened\n"; document.myform.txtout.value += "---- Values --\n"; for (i=0; i<document.myform.my_radio.length; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } //document.myform.my_radio[3].checked = true; /*document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } */ } function handle_mouse( btn ) { return; document.myform.txtout.value += String(btn) + " Mouseover Happened\n"; document.myform.txtout.value += "---- Values --\n"; for (i=0; i<document.myform.my_radio.length; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } document.myform.my_radio[2].click(); document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.myform.my_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } } function handle_oclick( btn ) { document.myform.txtout.value += String(btn) + "...\n"; return; document.myform.txtout.value += "---- Values Before --\n"; for (i=0; i<4; i++) { if ( document.other_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } document.other_radio[0].checked = true; document.myform.txtout.value += "---- Values After --\n"; for (i=0; i<4; i++) { if ( document.other_radio[i].checked ) document.myform.txtout.value += String(i) + "is checked --\n"; else document.myform.txtout.value += String(i) + "is NOT checked --\n"; } } --> </script> <form name="myform" > <BR> <BR> <div id="a" style="color:red"> <input name="my_radio" type="radio" value="Radio1" onclick ="handle_click(1);" onfocus="handle_focus(1);" onmouseover="handle_mouse(1);" >TT1</input><BR> <input name="my_radio" type="radio" value="Radio2" checked onclick ="handle_click(2);" onfocus="handle_focus(2);" onmouseover="handle_mouse(2);" >TT2</input><BR> <input name="my_radio" type="radio" value="Radio3" onclick ="handle_click(3);" onfocus="handle_focus(3);" onmouseover="handle_mouse(3);" >TT3</input><BR> <input name="my_radio" type="radio" value="Radio4" onclick ="handle_click(4);" onfocus="handle_focus(4);" onmouseover="handle_mouse(4);" >TT4</input><BR> </div> <textarea name ="txtout" rows=20 value="" style="height:800; width:800" > </textarea> </form> <input name="other_radio" type="radio" value="ORadio1" onclick ="handle_oclick (5);" >TO1</input><BR> <input name="other_radio" type="radio" value="ORadio2" checked onclick ="handle_oclick(6);" >TO2</input><BR> <input name="other_radio" type="radio" value="ORadio3" onclick ="handle_oclick (7);" >TO3</input><BR> <input name="other_radio" type="radio" value="ORadio4" onclick ="handle_oclick (8);" >TO4</input><BR> </body> </html>
Browser, not bugzilla.
Assignee: myk → rods
Component: User Interface → HTML Form Controls
Product: Bugzilla → Browser
QA Contact: matty → tpreston
Version: unspecified → other
-->
Assignee: rods → jkeiser
Prasad: please include specific steps to reproduce (what do I need to click on? what does happen for you? what *should* happen?). I am not sure which radio buttons you have a problem with or precisely how I can tell that things are broken the way you are seeing. Also please attach the testcase as an attachment--posting long HTML in a bug really clutters the discussion and is harder to work with than an attached file, which we can just click on to test. You can use the "Create a New Attachment" link in the bug I am tempted to mark this a dup of bug 14445 since the only ones I see that are not mutually exclusive are ones outside of a form--and you can see it visually, you don't need the DOM.
Marking dup. *** This bug has been marked as a duplicate of 14445 ***
Status: NEW → RESOLVED
Closed: 23 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.