jimfog Posted May 25, 2013 Share Posted May 25, 2013 I want to get the value of the radio button the user selected and send that with JSON to the server.I am not interested in learning the JSON syntax to use-more or less I know that. I want to know how to "grab" the value of the radio button selected by the user. THis is the HTML: <td> <label class="label" for="buztype">buztype</label><br></td> <input type="radio" id="1" name="buztype" value="1"> petshop<br> <input type="radio" id="2" name="buztype" value="2"> salon spa <br> <input type="radio" id="3" name="buztype" value="3">medical <br> What js code will be needed to accomplish the task described above? Link to comment Share on other sites More sharing options...
Don E Posted May 25, 2013 Share Posted May 25, 2013 (edited) This may be of some help: http://www.w3schools...dio_checked.asp Or you can try this: Say the id for the form above is: id="formBuzType" var form = document.getElementById('formBuzType'); // loop through the radio buttons to find which one is checked, then set var valueSelected to the value of the selected radio button for(var i = 0; i < form.buztype.length; i++) // buztype is the name of the radio buttons which is an array; ie buztype[0].value is 1, buztype[1].value is 2, buztype[2].value is 3 based on what you have above. { if(form.buztype[i].checked) { var valueSelected = form.buztype[i].value; } } Hope this helps. Edited May 25, 2013 by Don E Link to comment Share on other sites More sharing options...
jimfog Posted May 27, 2013 Author Share Posted May 27, 2013 The code you gave me does not work...it might be correct in itself but in the broader code context I think there is something wrong-see the whole code $(function() { $('.error').hide(); $("#savepersonal").click(function() { event.preventDefault(); $('.error').hide(); var name = $("input#name").val(); if (name == "") { $("label#name_error").show(); $("input#name").focus(); return false; } var lastname = $("input#lastname").val(); if (lastname == "") { $("label#lastname_error").show(); $("input#lastname").focus(); return false; }var form = document.getElementById('formBuzType'); // loop through the radio buttons to find which one is checked, then set var valueSelected to the value of the selected radio button for(var i = 0; i < form.buztype.length; i++) // buztype is the name of the radio buttons which is an array; ie buztype[0].value is 1, buztype[1].value is 2, buztype[2].value is 3 based on what you have above. { if(form.buztype[i].checked) { var valueSelected = form.buztype[i].value; } } $.ajax({ type: "POST", url: "testajax.php", data: {"name":name,"lastname":lastname,"btype":valueSelected} }); return false; }); }); Link to comment Share on other sites More sharing options...
Don E Posted May 27, 2013 Share Posted May 27, 2013 Hey Jim, I'm not too familiar with jquery but the following code may give you insight on what you're probably missing in your code that's not allowing it work: <!doctype html><html><head><meta charset="UTF-8"><title>Form radio button checking</title> <script type="text/javascript"> function checkValue() // if you pass the form, checkValue(form){ var form = document.getElementById('formBuzType'); // if you passed the form, you wouldn't need this line. for(var i = 0; i < form.buztype.length; i++) { if(form.buztype[i].checked) { var selectedValue = form.buztype[i].value; } } alert(selectedValue); return false;} </script> </head> <body> <form id="formBuzType" method="post" action="#" onSubmit="return checkValue();" > <!-- you can pass the form here as well by doing: return checkValue(this); --><input type="radio" id="1" name="buztype" value="1"> petshop<br> <input type="radio" id="2" name="buztype" value="2"> salon spa <br> <input type="radio" id="3" name="buztype" value="3">medical <br><input type="submit" value="Submit"/></form></body></html> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now