Validate form with PHP and JavaScript -
i have here register html form elements. need validate elements on server side , client side , explain why. example, in html form have:
<form action="<?=$_server['php_self']?>" method="post"> user name:<input type="text" name="user_name"/><br/> email:<input type="text" name="user_email"/><br/> password:<input type="text" name="user_password"/><br/> </form>
i use php check if email , user exists in database. , can use php identify if input fields empty too.
if (isset($_post['submit'])) { $user_name = $_post['user_name']; $user_email = $_post['user_email']; $user_password = $_post['user_password']; $exists = ""; $sql = "select user_name users user_name = '{$user_name}' limit 1"; $stmt = $connection->prepare($sql); $stmt->execute(); $num = $stmt->rowcount(); if ($num == 1) { $exists .= "u"; } $sql = "select user_email users user_email = '{$user_email}' limit 1"; $stmt = $connection->prepare($sql); $stmt->execute(); $num = $stmt->rowcount(); if ($num == 1) { $exists .= "e"; } if (empty($user_name) || empty($user_email) || empty($user_password)) { echo "<script>alert('please fill input fields register!');</script>"; } else if($exists == "u") { echo "<script>alert('this user registered in our system.');</script>"; } else if($exists == "e") { echo "<script>alert('this email registered in our system.');</script>"; } else if($exists == "ue") { echo "<script>alert('this user , email registered in our system.');</script>"; } else { //here insert values in database } }
looks perfect, except 1 thing: when click submit page refreshed , input fields values cleaned. bad because user have enter informations again because wrong. know reason because validating form after sending php. overcome problem need validate fields before sending form, logically using javascript in client side. how check in database? need use php that. if did not have check database use javascript only. have mix validations javascript , php, think should use ajax, not know how.
personally check @ client level (javascript) not in php hey if insists try this
if ($_post["password_user"] != $_post["confirm_password"]) echo "<script>alert('the entered passwords doesn't match. try again.'); document.getelementbyid('inputpassword').value = $_post['password_user']; document.getelementbyid('inputconfirmpassword').value = $_post['confirm_password']; </script>";
also update html input have ids
password:<font color="red">*</font> <input id="inputpassword" type="password" name="password_user"/><br/> confirm password:<font color="red">*</font> <input id="inputconfirmpassword" type="password" name="confirm_password"/><br/>
edit:
added ajax tutorial:
- without jquery
- with jquery (i find easier use)
edit2:
sample code php (server side) returns json fed client (javascript)
<?php $canlogin = false; $responsearray = array(); // logic here // .... if ($canlogin) { $responsearray["status"] = "success"; } else { //use appropriate http header (default 200), missed developers http_response_code(404); $responsearray["status"] = "error"; } return json_encode($responsearray); ?>
Comments
Post a Comment