Chrisj Posted May 29, 2014 Share Posted May 29, 2014 Can you help me integrate this code : <form method="post" action="submit.php"> <input type="checkbox" class="required" /> Click to check <br /> <input disabled="disabled" type='submit' id="submitBtn" value="Submit"> </form> In to this Contact Form code, please? <form action="../page.php?page=1" method="post" name="contact_us" onSubmit="return capCheck(this);"> <table cellpadding="5" width="100%"> <tr> <td width="10" class="required_field">*</td> <td width="80">Your Name</td> <td><input type="text" name="name" maxlength="40" style="width:400px;/></td> </tr> <tr> <td class="required_field">*</td> <td>Email Address</td> <td><input type="text" name="email" maxlength="40" style="width:400px;/></td> </tr> <tr> <td></td> <td>Comments:</td> <td><textarea name="comments" style="width: 400px; height: 250px;"></textarea></td> </tr> </table> </form Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/ Share on other sites More sharing options...
Ch0cu3r Posted May 29, 2014 Share Posted May 29, 2014 All you need to do is copy the two <input ..> lines to where you want them located in your form. Also why the disabled submit button? This will prevent the user from submitting the form. Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/#findComment-1481294 Share on other sites More sharing options...
Psycho Posted May 29, 2014 Share Posted May 29, 2014 (edited) Also why the disabled submit button? This will prevent the user from submitting the form. Since the "checkbox" field has a class of 'required', I'm guessing it's something like a Terms Of Use type thing where the user must select to acknowledge something in order to submit. @Chrisj: that's not how it should be done. If the user had JS disabled then they would be blocked from using the form. The submit button should not be disabled by default. Have an onload event that uses JS to disable it. Then enable it once they click it. That way you get the process you want for users that have JS enabled. For non JS users they can still submit the form. But, you would add error handling on the receiving page to check if they checked the box or not. If not, send them back to the form with appropriate error messaging. Edited May 29, 2014 by Psycho Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/#findComment-1481297 Share on other sites More sharing options...
Chrisj Posted May 29, 2014 Author Share Posted May 29, 2014 Thanks for your replies. I also have this code: <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script> <script> $(function() { $('input.required').click(function() { var unchecked = $('input.required:not(:checked)').length; if (unchecked == 0) { $('#submitBtn').removeAttr('disabled'); } else { $('#submitBtn').attr('disabled', 'disabled'); } }); }); </script> Does that make it more like "how it should be done"? I look forward to your reply. Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/#findComment-1481301 Share on other sites More sharing options...
Psycho Posted May 29, 2014 Share Posted May 29, 2014 No. That is the function for enabling/disabling the submit button - which you still need. The problem is that the default state of the submit button needs to be enabled. Then, on page load, use JavaScript to disable it. Although that function could be a little cleaner. Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/#findComment-1481306 Share on other sites More sharing options...
Chrisj Posted May 29, 2014 Author Share Posted May 29, 2014 Thanks for your reply. I see what you mean, that makes sense, thanks, but I don't know how to "on page load, use JavaScript to disable it", because i'm not a coder. I was provided this code. Can you please help add 'on page load, use JavaScript to disable it' ? Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/#findComment-1481308 Share on other sites More sharing options...
Psycho Posted May 29, 2014 Share Posted May 29, 2014 Without rewriting it all, you can add this: $( document ).ready(function() { $('#submitBtn').attr('disabled', 'disabled'); }); Working example <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script> <script> $( document ).ready(function() { $('#submitBtn').attr('disabled', 'disabled'); }); $(function() { $('input.required').click(function() { var unchecked = $('input.required:not(:checked)').length; if (unchecked == 0) { $('#submitBtn').removeAttr('disabled'); } else { $('#submitBtn').attr('disabled', 'disabled'); } }); }); </script> </head> <body> <form action="../page.php?page=1" method="post" name="contact_us" onSubmit="return capCheck(this);"> <table cellpadding="5" width="100%"> <tr> <td width="10" class="required_field">*</td> <td width="80">Your Name</td> <td><input type="text" name="name" maxlength="40" style="width:400px;"/></td> </tr> <tr> <td class="required_field">*</td> <td>Email Address</td> <td><input type="text" name="email" maxlength="40" style="width:400px;"/></td> </tr> <tr> <td></td> <td>Comments:</td> <td><textarea name="comments" style="width: 400px; height: 250px;"></textarea></td> </tr> <tr> <td></td> <td></td> <td> <input type="checkbox" class="required" /> Click to check<br /> <input type='submit' id="submitBtn" value="Submit"> </td> </tr> </table> </form> </body> </html> However, as I said before, you need to modify the page that receives the form post to verify that the checkbox was checked. Quote Link to comment https://forums.phpfreaks.com/topic/288864-help-me-integrate-this-code-with-this-code-contact-form/#findComment-1481319 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.