jdubwelch Posted December 9, 2007 Share Posted December 9, 2007 Ideally, I would like my submit button to be disabled until all the fields are filled in. I had a go at it by having a "check" button (which i think is unneccessary, but I don't know how to do it otherwise). I followed a tutorial on disabling submit, but it wasn't exactly what I am trying to do and it's not enabling my submit button. I need help with: 1. Having the submit button being disabled until all the forms are filled in. 2. If it can be done without my lame "check" button that'd be awesome too. <form action="" method="post" name="myForm"> <table width="752" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="135">AWAY</td> <td width="133">HOME</td> <td width="132">WINNER</td> <td width="132"> </td> </tr> <tr> <td><a href="javascript:void(0);" onClick="setWinner('Oregeon State',0);" id="linkaway0">Oregon State</a></td> <td><a href="javascript:void(0);" onClick="setWinner('Oregon',0);" id="linkhome0">Oregon</a></td> <td id="row0"> </td> <td><input name="ot0" type="text" id="ot0" size="3" /></td> <input type=hidden id="winner0" name="winners[]" value=""> </tr> <tr> <td><a href="javascript:void(0);" onClick="setWinner('Washington',1);" id="linkaway1">Washington</a></td> <td><a href="javascript:void(0);" onClick="setWinner('Washington State',1);" id="linkhome1">Washington State</a></td> <td id="row1"> </td> <td><input name="ot1" type="text" id="ot1" size="3" /></td> <input type=hidden id="winner1" name="winners[]" value=""> </tr> <tr> <td colspan="4"><div align="center"><input name="checkForm" type="button" id="checkForm" onClick="checkForm()" value="Check" /> <input name="Submit" type="submit" disabled value="submit" id="submitButton" /></div></td> </tr> </table> </form> <script language="JavaScript" type="text/javascript"> <!-- function setWinner(clickedObjId,row) { document.getElementById('row'+row).innerHTML = clickedObjId; document.getElementById('winner'+row).value = clickedObjId; } function checkForm () { for (var i=0; i<=1; i++) { if ( document.getElementById('winner' + i).value == "" ) { alert ( "Please enter your zip." ); document.getElementById('row' + i).focus(); return false; } } if (true) { myForm.Submit.disabled = true; } } // --> </script> Link to comment https://forums.phpfreaks.com/topic/80827-solved-help-with-disabling-submit-button/ Share on other sites More sharing options...
phpQuestioner Posted December 9, 2007 Share Posted December 9, 2007 <script language="JavaScript" type="text/javascript"> function setWinner(clickedObjId,row) { document.getElementById('row'+row).innerHTML = clickedObjId; document.getElementById('winner'+row).value = clickedObjId; } function checkMyForm () { for (var i=0; i<=1; i++) { if ( document.getElementById('winner' + i).value == "" ) { alert ( "Please enter your zip." ); document.getElementById('row' + i).focus(); return false; } } if (true) { document.getElementById('submitButton').disabled = false; } } </script> </head><body> <form action="" method="post" name="myForm"> <table width="752" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="135">AWAY</td> <td width="133">HOME</td> <td width="132">WINNER</td> <td width="132"> </td> </tr> <tr> <td><a href="javascript:void(0);" onClick="setWinner('Oregeon State',0);" id="linkaway0">Oregon State</a></td> <td><a href="javascript:void(0);" onClick="setWinner('Oregon',0);" id="linkhome0">Oregon</a></td> <td id="row0"> </td> <td><input name="ot0" type="text" id="ot0" size="3" /></td> <input type=hidden id="winner0" name="winners[]" value=""> </tr> <tr> <td><a href="javascript:void(0);" onClick="setWinner('Washington',1);" id="linkaway1">Washington</a></td> <td><a href="javascript:void(0);" onClick="setWinner('Washington State',1);" id="linkhome1">Washington State</a></td> <td id="row1"> </td> <td><input name="ot1" type="text" id="ot1" size="3" /></td> <input type=hidden id="winner1" name="winners[]" value=""> </tr> <tr> <td colspan="4"><div align="center"><input name="checkForm" type="button" id="checkForm" onclick="checkMyForm()" value="Check" /> <input name="Submit" type="submit" disabled value="submit" id="submitButton" /></div></td> </tr> </table> </form> You will need the "Check" button or some other object/element process the "checkMyForm()" function. You could use any element/object and most any event (doesn't necessarily have to be an "onclick" event) to trigger the "checkMyForm()" function. Link to comment https://forums.phpfreaks.com/topic/80827-solved-help-with-disabling-submit-button/#findComment-410098 Share on other sites More sharing options...
jdubwelch Posted December 9, 2007 Author Share Posted December 9, 2007 would it be possible to make a function that would count everytime they "changed" and input box and say there are 15 input boxes on the page. When the function got to 15 it would enable the submit button. Ideas? Link to comment https://forums.phpfreaks.com/topic/80827-solved-help-with-disabling-submit-button/#findComment-410189 Share on other sites More sharing options...
phpQuestioner Posted December 9, 2007 Share Posted December 9, 2007 yeah - but they could just change the same input field 15 times and not fill out the other 14 input fields. your best off to go with the way you got it now. Link to comment https://forums.phpfreaks.com/topic/80827-solved-help-with-disabling-submit-button/#findComment-410211 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.