fix AJAX form validation

src/js/register.js

@@ -4,24 +4,30 @@ function validate(field, str){
     xmlhttp.onreadystatechange = function() {
       if (this.readyState == 4 && this.status == 200) {
         if (this.responseText == 'valid'){
-          console.log(this.responseText);
           if (field == 'username') {
             document.getElementsByClassName('valid-status')[0].innerHTML = '<img src="img/check.png" alt="valid">';
           } else {
             document.getElementsByClassName('valid-status')[1].innerHTML = '<img src="img/check.png" alt="valid">';
           }
+          return true;
         } else {
-          console.log(this.responseText);
           if (field == 'username') {
             document.getElementsByClassName('valid-status')[0].innerHTML = '<img src="img/cross.png" alt="invalid">';
           } else {
             document.getElementsByClassName('valid-status')[1].innerHTML = '<img src="img/cross.png" alt="invalid">';
           }
+          return false;
         }
       }
     };
     xmlhttp.open("GET", "validate.php?form=" + field + "&value=" + str, true);
     xmlhttp.send();
+  } else {
+    if (field == 'username') {
+      document.getElementsByClassName('valid-status')[0].innerHTML = '<img src="img/cross.png" alt="invalid">';
+    } else {
+      document.getElementsByClassName('valid-status')[1].innerHTML = '<img src="img/cross.png" alt="invalid">';
+    }
   }
 }
 
@@ -34,3 +40,35 @@ function checkConfirmPasswd(cpassform){
     return true;
   }
 }
+
+function isFilled(){
+  var form = document.getElementsByClassName('form-control');
+  var isAllfilled = true;
+
+  for (var i = 0; i < form.length; i++){
+    if (form[i].value == ''){
+      isAllfilled = false;
+      break;
+    }
+  }
+  return isAllfilled;
+}
+
+function verifyAll(req1, req2, req2){
+  if (req1 && req2 && req3) return true;
+  return false;
+}
+
+
+function submitForm(){
+  var usernameField = document.getElementsByTagName('input')[1];
+  var emailField = document.getElementsByTagName('input')[2];
+  var cPasswdField = document.getElementsByTagName('input')[4];
+  var req1, req2, req3;
+
+  req1 = validate('username', usernameField.value) && validate('email', emailField.value);
+  req2 = checkConfirmPasswd(cPasswdField);
+  req3 = isFilled();
+  alert('please fulfill all field..!!');
+  return verifyAll(req1, req2, req3);
+}

src/login.php

@@ -18,10 +18,10 @@
           <span><b>LOGIN</b></span>
         </h1>
         <form class="form-group" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
-          <label>phpUsername</label>
-          <input type="text" class="form-control" name="username" >
+          <label>Username</label>
+          <input type="text" class="form-control" name="username" required>
           <label>Password</label>
-          <input type="password" class="form-control" name="password" ><br><br>
+          <input type="password" class="form-control" name="password" required><br><br>
           <button type="submit" >GO!</button>
         </form>
         <a class="signup-link" href="register.php">Don't have an account?</a>
@@ -56,7 +56,7 @@ function authenticate($username, $password) {
       mysqli_stmt_bind_result($stmt, $hasil_id, $hasil_username, $hasil_password);
       if(mysqli_stmt_fetch($stmt)){
         if(password_verify($password, $hasil_password)){
-          /* Hasil match buat session */
+          // Hasil match
           return $hasil_id;
         }
       }

src/register.php

@@ -18,13 +18,13 @@
         <h1 class="no-background">
           <span><b>SIGN UP</b></span>
         </h1>
-        <form class="form-group" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
+        <form class="form-group" onsubmit="return submitForm()" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
           <label>Your Name</label>
           <input type="text" class="form-control" name="nama" >
           <label>Username</label>
-          <input type="text" class="form-control validation" onkeyup="validate(this.name,this.value)" name="username" ><span class="valid-status"></span>
+          <input type="text" class="form-control validation" onkeyup="return validate(this.name,this.value)" name="username" ><span class="valid-status"></span>
           <label>Email</label>
-          <input type="text" class="form-control validation" onkeyup="validate(this.name,this.value)" name="email" ><span class="valid-status"></span>
+          <input type="text" class="form-control validation" onkeyup="return validate(this.name,this.value)" name="email" ><span class="valid-status"></span>
           <label>Password</label>
           <input type="password" class="form-control" name="password" >
           <label>Confirm Password</label>
@@ -45,7 +45,7 @@
 
 <?php
 require_once 'dbconfig.php';
-
+include 'login.php';
 
 function register($data){
   $sqlconn = mysqli_connect(DB_SERVER, DB_USERNAME, DB_PASSWORD, DB_NAME);
@@ -73,7 +73,14 @@ if($_SERVER['REQUEST_METHOD'] == 'POST'){
 
   if (register($data)) {
     // header('Location : /');
-    echo 'sukses';
+    if ($id = authenticate($_POST['username'], $_POST['password'])){
+      $_SESSION['user_id'] = $id;
+      if ($data->isdriver) {
+        header('Location : profile.php?id=' . $id);
+      } else {
+        header('Location : order-ojek.php');
+      }
+    }
   }
 }