Hi, Just like the title says, I need a javascript code that will keep a "Submit" button grayed out (unclickable) until the person checks out either a checkbox or radio button (it's up to you which one you will choose - radio button or checkbox). I searched the internet up and down and couldn't find what I need. Thank you for your help!
document.getElementsByName("myButton")[0].disabled =true; Code (markup): will disable the button (put the code near end of the page). document.getElementsByName("myButton")[0].disabled = false; Code (markup): in the click event of the checkbox or radio button (check to make sure that the right radio button is chosen or the checkbox is checked first) will enable it. (Change "myButton" to the name of your button.)
A word of advice if you are going to do that -- Rukbat says "disable the button" for a reason; disable it with the scripting so that scripting OFF the page still works -- and double check your value server side. As always, design the page to work WITHOUT JS FIRST, THEN you can go ahead and add things like this with scripting. Also be warned that "enter" from a normal input WILL submit, regardless of if you've greyed out the submit button or not, so you'd want to trap 'onsubmit' as well.
This is not probably the best practice but it will get the job done, as @deathshadow said you must check the validation on the server side also. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title></title> <style> </style> </head> <body> <input type="checkbox" onchange="Check(this)"> <input id="submit" type="submit" value="submit" disabled> <script> function Check(el){ // this will grab the input element var button = document.getElementById("submit"); // check whether the submit button is enabled if ( button.disabled == true ){ button.disabled = false; // if it is then disable it }else{ button.disabled = true; // otherwise enable it } } </script> </body> </html> HTML: