CODEWITHSUNDEEP
jquery
user951042
user951042

Reputation:

jQuery Radio button

I was wondering why this isn't working properly on IE, when you choose a radio button?

<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("input[name='crkbrd']").change(function(){
    if ($("input[name='crkbrd']:checked").val() == 'Upload')
       { alert("Upload Your Own Ad"); }
    else if ($("input[name='crkbrd']:checked").val() == 'Edit')
        { alert("Edit Your Ad Here"); }
    else
      { alert("You haven't chosen anything"); }
});

});
</script>
</head>
<body>
<input type="radio" id="rb1" name="crkbrd" value="Upload" /> Upload Your Own Ad<br />
<input type="radio" id="rb2" name="crkbrd" value="Edit" /> Edit Your Ad Here
</body>
</html>

Upvotes: 0

Views: 143

Answers (2)

Ghazanfar Mir
Ghazanfar Mir

Reputation: 3543

I have this working on IE 8, Firefox and chrome browsers

Try assigning a class attribute to the radio buttons as:

<input type="radio" id="rb1" name="crkbrd" value="Upload" class="myRadio" /> Upload Your Own Ad<br />
<input type="radio" id="rb2" name="crkbrd" value="Edit" class="myRadio" /> Edit Your Ad Here

and then use the following:

 $( ".myRadio" ).change( function(){ 
    if ($(this).val() == 'Upload') { 
       alert("Upload Your Own Ad"); 
    } else 
     if ($(this).val() == 'Edit') { 
        alert("Edit Your Ad Here"); 
     } else { 
      alert("You haven't chosen anything");
     } 

 });

Upvotes: 0

scunliffe
scunliffe

Reputation: 63588

IE has a bug with radio buttons in that it doesn't fire the change event until the radio button is blurred. Use the click event instead.

Bug details: http://webbugtrack.blogspot.com/2007/11/bug-193-onchange-does-not-fire-properly.html

Note this bug was fixed in IE9 (as long as you are running in standards mode)

Upvotes: 4

Related Questions