{"id":337,"date":"2016-01-24T16:12:03","date_gmt":"2016-01-24T16:12:03","guid":{"rendered":"http:\/\/stackofcodes.in\/?p=33"},"modified":"2016-01-24T16:12:03","modified_gmt":"2016-01-24T16:12:03","slug":"submit-register-form-without-refreshing-the-page","status":"publish","type":"post","link":"https:\/\/www.chandansharma.co.in\/blog\/submit-register-form-without-refreshing-the-page\/","title":{"rendered":"Submit Register Form without refreshing the page"},"content":{"rendered":"
<!---- index.php page---->\n\n<html>\n <body>\n <!------making jquery library's link --->\n <script src=\"\/\/code.jquery.com\/jquery-1.10.2.js\"><\/script>\n <script>\n function validate()\n {\n \/\/--------value of fields ---------\n var name = document.getElementById(\"name\").value;\n var email = document.getElementById(\"email\").value;\n var phone = document.getElementById(\"phone\").value;\n \n \/\/------ error fields are identified first --------\n var error_name_id = document.getElementById(\"error_name\");\n var error_email_id = document.getElementById(\"error_email\");\n var error_phone_id = document.getElementById(\"error_phone\");\n var error_msg = document.getElementById(\"error_msg\");\n var success_msg = document.getElementById(\"success_msg\");\n \n \/\/---Making all error field first Blank\n error_name_id.innerHTML =\"\";\n error_email_id.innerHTML =\"\";\n error_phone_id.innerHTML =\"\";\n \n\u00a0\/\/--------Form Validation to check blank fields -------\n if(name == null || name == \"\" || name == \" \")\n {\n error_name_id.innerHTML =\"Name is Empty\";\n }\n else if(email == null || email == \"\" || email == \" \")\n {\n error_email_id.innerHTML =\"Email is Empty\";\n }\n else if(phone == null || phone == \"\" || phone == \" \")\n {\n error_phone_id.innerHTML =\"Phone is Empty\";\n }\n else\n {\n    var datastring = {'name':name, 'email':email, 'phone':phone };\n    $.ajax({\n       url:\"register.php\",\n       type:\"post\",\n       data: datastring,\n    }).done(function(data)\n   {\n      if(data == \"DONE\")\n      {\n         success_msg.innerHTML = \"Registered Successfully\";\n      }\n      else\n      {\n         error_msg.innerHTML = \"Failed to Register\";\n      }\n      \n      document.getElementById(\"name\").value = \"\";\n      document.getElementById(\"email\").value = \"\";\n      document.getElementById(\"phone\").value = \"\";\n   }); \n\n }\n \n return false;\n }\n <\/script>\n \n \n <form name=\"frm_register\" name=\"\" id=\"\" action=\"\" method=\"POST\" onsubmit=\"return validate();\">\n <h3>Registration Form<\/h3>\n Name: <input type=\"text\" name=\"name\" id=\"name\" >\n <span id=\"error_name\"><\/span>\n <br\/>\n <br\/>\n Email: <input type=\"email\" name=\"email\" id=\"email\">\n <span id=\"error_email\"><\/span>\n <br\/>\n <br\/>\n Phone: <input type=\"text\" name=\"phone\" id=\"phone\">\n <span id=\"error_phone\"><\/span>\n <br\/>\n <br\/>\n <input type=\"submit\" name=\"register\" id=\"register\" value=\"register\">\n <br\/>\n <span id=\"error_msg\" style=\"color:red\"><\/span>\n <span id=\"success_msg\" style=\"color:green;\"><\/span>\n <\/form>\n <\/body>\n<\/html>\n\n\n<!--------in register.php -----><\/span>\n\n<?php\n$dbhost=\"localhost\";\n$dbuser=\"root\";\n$dbpass=\"\";\n$dbname=\"test\";\n$con = mysql_connect('localhost', 'root', '');\n$msg = \"\";\n\nif ($con)\n{\n    mysql_select_db($dbname); \n \n    $name = $_POST['name'];\n    $email = $_POST['email'];\n    $phone = $_POST['phone'];\n \n    $query = \"INSERT INTO register(F_NAME, CONTACT, EMAIL)   VALUES('$name', '$phone' , '$email')\"; \n    $done = mysql_query($query, $con);\n \n   if($done)\n   {\n     $msg = \"DONE\" ;\n   }\n   else\n   {\n     $msg = \"FAIL\";\n   }\n   echo $msg;\n}\n\n?>\n\n\n<\/pre>\n","protected":false},"excerpt":{"rendered":"
<!—- index.php page—-> <html> <body> <!——making jquery library’s link —> <script src=”\/\/code.jquery.com\/jquery-1.10.2.js”><\/script> <script> function validate() { \/\/——–value of fields ——— var name = document.getElementById(“name”).value; var … <\/p>\n
<\/path><\/svg><\/span><\/a><\/path><\/svg><\/span><\/a><\/path><\/svg><\/span><\/a>