Google Ads

Validate HTML Form Using PHP/jQuery PHP Script


Validate HTML Form Using PHP/jQuery PHP Script

Today I am going to show how to validate form using jquery and php.

HTML Forms are one of the main points of interaction between a user and a web site or application

 

 
 
  1. <?php
  2. $name = '';
  3. $gender = '';
  4. $address = '';
  5. $email = '';
  6. $username = '';
  7. $password = '';
  8. $output = '';
  9. if($_POST) {
  10. // collect all input and trim to remove leading and trailing whitespaces
  11. $name = trim($_POST['name']);
  12. $gender = trim($_POST['gender']);
  13. $address = trim($_POST['address']);
  14. $email = trim($_POST['email']);
  15. $username = trim($_POST['username']);
  16. $password = trim($_POST['password']);
  17. $errors = array();
  18. // Validate the input
  19. if (strlen($name) == 0)
  20. array_push($errors, "Please enter your name");
  21. if (!(strcmp($gender, "Male") || strcmp($gender, "Female") || strcmp($gender, "Other")))
  22. array_push($errors, "Please specify your gender");
  23. if (strlen($address) == 0)
  24. array_push($errors, "Please specify your address");
  25. if (!filter_var($email, FILTER_VALIDATE_EMAIL))
  26. array_push($errors, "Please specify a valid email address");
  27. if (strlen($username) == 0)
  28. array_push($errors, "Please enter a valid username");
  29. if (strlen($password) < 5)
  30. array_push($errors, "Please enter a password. Passwords must contain at least 5 characters.");
  31. // If no errors were found, proceed with storing the user input
  32. if (count($errors) == 0) {
  33. array_push($errors, "No errors were found. Thanks!");
  34. }
  35. //Prepare errors for output
  36. $output = '';
  37. foreach($errors as $val) {
  38. $output .= "<p class='output'>$val</p>";
  39. }
  40. }
  41. ?>
  42. <html>
  43. <head>
  44. <!-- Define some CSS -->
  45. <style type="text/css">
  46. .label {width:100px;text-align:right;float:left;padding-right:10px;font-weight:bold;}
  47. #register-form label.error, .output {color:#FB3A3A;font-weight:bold;}
  48. </style>
  49. <!-- Load jQuery and the validate plugin -->
  50. <script src="js/jquery-1.9.1.js"></script>
  51. <script src="js/jquery.validate.min.js"></script>
  52. <!-- jQuery Form Validation code -->
  53. <script>
  54. // When the browser is ready...
  55. $(function() {
  56. // Setup form validation on the #register-form element
  57. $("#register-form").validate({
  58. // Specify the validation rules
  59. rules: {
  60. name: "required",
  61. gender: "required",
  62. address: "required",
  63. email: {
  64. required: true,
  65. email: true
  66. },
  67. username: "required",
  68. password: {
  69. required: true,
  70. minlength: 5
  71. }
  72. },
  73. // Specify the validation error messages
  74. messages: {
  75. name: "Please enter your name",
  76. gender: "Please specify your gender",
  77. address: "Please enter your address",
  78. email: "Please enter a valid email address",
  79. username: "Please enter a valid username",
  80. password: {
  81. required: "Please provide a password",
  82. minlength: "Your password must be at least 5 characters long"
  83. }
  84. },
  85. submitHandler: function(form) {
  86. form.submit();
  87. }
  88. });
  89. });
  90. </script>
  91. </head>
  92. <body>
  93. <?php echo $output; ?>
  94. <!-- The form that will be parsed by jQuery before submit -->
  95. <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" id="register-form" novalidate>
  96. <div class="label">Name</div><input type="text" id="name" name="name" value="<?php echo $name; ?>" /><br />
  97. <div class="label">Gender</div><select id="gender" name="gender" />
  98. <option value="Female">Female</option>
  99. <option value="Male">Male</option>
  100. <option value="Other">Other</option>
  101. </select><br />
  102. <div class="label">Address</div><input type="text" id="address" name="address" value="<?php echo $address; ?>" /><br />
  103. <div class="label">Email</div><input type="text" id="email" name="email" value="<?php echo $email; ?>" /><br />
  104. <div class="label">Username</div><input type="text" id="username" name="username" value="<?php echo $username; ?>" /><br />
  105. <div class="label">Password</div><input type="password" id="password" name="password" /><br />
  106. <div style="margin-left:140px;"><input type="submit" name="submit" value="Submit" /></div>
  107. </form>
  108. </body>
  109. </html>

 

 

 


Related Post

Facebook Campaigner – Facebook Autoposter PHP Sc... Facebook Campaigner – Facebook AutoposterFacebook Campaigner – Facebook AutoposterFacebook campaigner is a simple and user friendly application th...
Annotated Feedback PHP Script Download Annotated FeedbackAnnotated FeedbackAnnotated feedback is a simple yet powerful jQuery plugin that allows your users to send feedback with custom scre...
B2Evolution v6.9.0 beta Blog PHP Script B2Evolution v6.9.0 beta Blog PHP Script Create a beautiful blog website using this php scrpt. b2evolution is an advanced weblog tool, i-e softwa...
Form Word Count Validation v1 PHP Script Form Word Count Validation v1 PHP Script Hi, This tutorial is for novice in PHP. The script will validate the data inputted by the user if meet the...
Adsgem_Script New Full Version PHP Script Download Adsgem_Script New Full Version PHP Script Download This is an ad network PHP Script. You can create your own ad network. So, You can try with...

Have any Question or Comment?

Leave a Reply

Your email address will not be published. Required fields are marked *

"