n1concepts Posted October 10, 2011 Share Posted October 10, 2011 I found this JavaScript code that works flawlessly in ensuring an email (or at least something for that field) is defined. However, I need to modify this code to ensure a "radio" button is selected and if not, similar error message is shown on the form web page & preventing the form from being submitted. Here's the original code - which is unedited (I need it updated to validate the 'radio' button group' in the form: // script.js handle the form submit event on form (below) entitled form.html function prepareEventHandlers() { document.getElementById("form3").onsubmit = function() { // I NEED THE BELOW LOGIC CHANGED TO VALIDATE RADIO BUTTON IS CHECKED. if (document.getElementById("func").value == "") { document.getElementById("errorMessage").innerHTML = "Please select option via radio button!"; // to STOP the form from submitting return false; } else { // reset and allow the form to submit document.getElementById("errorMessage").innerHTML = ""; return true; } }; } // when the document loads window.onload = function() { prepareEventHandlers(); }; AND here is the actual form (form.html) I want the error message to appear if no radio button selected: <form action="includes/validate.php" method="post" name="form3" id="form3"> <input type="radio" name="func" value="work" id="func_0" /> <input type="radio" name="func" value="nonwork" id="func_1" /> <span id="errorMessage"></span> <input type="submit" name="submit3" id="submit3" class="rcorners" value="next>" tabindex="15" /></td> </form> <script src="script.js"></script> Note: the 'errorMessage' id is where Error message should put - which is the case if I was validating on email field. Again, I need some help to modify the (above) JS script to check if one of the "func" radio buttons selected before allowing form to be submitted. If neither button selected, then error message appear within SPAN tag id 'errorMessage'. Thx for help! Quote Link to comment Share on other sites More sharing options...
sunfighter Posted October 11, 2011 Share Posted October 11, 2011 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>New document</title> <meta name="generator" content="TSW WebCoder 2010" /> <script type="text/javascript"> // script.js handle the form submit event on form (below) entitled form.html function prepareEventHandlers() { document.getElementById("form3").onsubmit = function() { if ((document.getElementById("func_0").checked == true) || (document.getElementById("func_1").checked == true)) { document.getElementById("errorMessage").innerHTML = "radio button is good to good"; // to STOP the form from submitting //return true; // uncomment this line to have submit working return false; // remove line when using in the real world } else { // reset and allow the form to submit document.getElementById("errorMessage").innerHTML = "Please select one button!"; return false; } }; } // when the document loads window.onload = function() { prepareEventHandlers(); }; </script> </head> <body> <form action="includes/validate.php" method="post" name="form3" id="form3"> <input type="radio" name="func" value="work" id="func_0" /> <input type="radio" name="func" value="nonwork" id="func_1" /> <span id="errorMessage"></span> <input type="submit" name="submit3" id="submit3" class="rcorners" value="next>" tabindex="15" /></td> </form> </body> </html> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.