register page redirection done, added toggle button on edit profile

controller/edit-profile.php

 <?php
 
-//TODO: Refresh page after save, image kalo ga dimasukkin pake yg lama, cek smua input gaboleh salah
 
 /* Model */
 include "../model/user.php";
@@ -41,3 +40,4 @@ if(isset($_POST["submit"])) {
 }
 
 
+

controller/register.php

@@ -46,7 +46,12 @@ if(isset($_POST["register"])) {
             $isDriver = 1;
         }
     }
+
     $user -> createUser($name,$username,$email,$password,$phone,$isDriver);
-    $userid = $user->getIdByUser($username);
-    header('Location: ../view/dashboard.php?id=' . (integer)$user->getIdByUser($username));
+    $id = 0;
+    $result = $user->getIdByUser($username);
+    while($row = mysqli_fetch_array($result)) {
+        $id = $row['id'];
+    }
+    header('Location: ../view/dashboard.php?id=' . $id);
 }

css/edit-profile.css

-.container {
-  width : 100%;
-}
 
 .edit-image {
   font-size: 0;
@@ -48,11 +45,63 @@
   text-align: right;
 }
 
-.checkbox input {
-  margin: 0;
-  transform: scale(1.5);
-  -ms-transform: scale(1.5);
-  -webkit-transform: scale(1.5);
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 60px;
+  height: 34px;
+}
+
+.switch input {
+  display: none;
+}
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 26px;
+  width: 26px;
+  left: 4px;
+  bottom: 4px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+input:checked + .slider {
+  background-color: #55D069;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(26px);
+  -ms-transform: translateX(26px);
+  transform: translateX(26px);
+}
+
+
+.slider {
+  border-radius: 34px;
+}
+
+.slider:before {
+  border-radius: 50%;
 }
 
 .back {

js/edit-profile.js

@@ -21,4 +21,31 @@ function getUserProfile() {
     xmlhttp.send();
 }
 
+function checkAllInput() {
+    var name = document.editForm["name"];
+    var phone = document.editForm["phone"];
+
+    //Check name
+    if(name.value == "") {
+        alert("Your name field must be filled!");
+        return false;
+    } else if (name.value.length > 20) {
+        alert("Name must be 1-20 characters long!");
+        return false;
+    }
+
+    //Check Phone
+    var regex = /^08([0-9]){1,}$/;
+    if(phone.value == "") {
+        alert("Phone number field must be filled!");
+        return false;
+    } else if(phone.value.length < 9 || phone.value.length > 12 ) {
+        alert("Phone number must be 9-12 digits!");
+        return false;
+    }
+    if(regex.test(phone.value) === false) {
+        alert("Phone number must be valid");
+        return false;
+    }
+}
 

js/register.js

@@ -14,6 +14,7 @@ function checkUsername() {
                 if(response == 'no') {
                     document.getElementById("check-icon-username").style.display = 'none';
                     document.getElementById("delete-icon-username").style.display = 'inline-block';
+
                 }
             }
         }
@@ -45,3 +46,98 @@ function checkEmail() {
     }
 }
 
+function checkAllInput() {
+    //Check Name
+    var name = document.registerForm["full-name"];
+    var user = document.registerForm.username;
+    var email = document.registerForm.email;
+    var password = document.registerForm.password;
+    var confirmPassword = document.registerForm["confirm-password"];
+    var phone = document.registerForm.phone;
+    //check Name
+    if(name.value == "") {
+        alert("Your name field must be filled!");
+        return false;
+    } else if (name.value.length > 20) {
+        alert("Name must be 1-20 characters long!");
+        return false;
+    }
+    //Check Username
+    if(user.value == "") {
+        alert("Username field must be filled!");
+        return false;
+    } else if (user.value.length > 20) {
+        alert("Name must be 1-20 characters long!");
+        return false;
+    }
+    //Check email
+    if(email.value == "") {
+        alert("Email field must be filled!");
+        return false;
+    }
+    //Check password
+    if(password.value == "") {
+        alert("Password field must be filled!");
+        return false;
+    }
+    //Check confirmPassword
+    if(confirmPassword.value == "") {
+        alert("Confirm Password field must be filled!");
+        return false;
+    }
+    if(password.value != confirmPassword.value) {
+        alert("Password and Confirm Password field must be the same!");
+        return false;
+    }
+    //Check Phone
+    var regex = /^08([0-9]){1,}$/;
+    if(phone.value == "") {
+        alert("Phone number field must be filled!");
+        return false;
+    } else if(phone.value.length < 9 || phone.value.length > 12 ) {
+        alert("Phone number must be 9-12 digits!");
+        return false;
+    }
+    if(regex.test(phone.value) === false) {
+        alert("Phone number must be valid");
+        return false;
+    }
+
+    // var name = document.forms["form"]["full-name"].value;
+    // if(name == "") {
+    //     alert("Your name field must be filled!");
+    //     return false;
+    // //Check username
+    // var username = document.forms["form"]["username"].value;
+    // if(username == "") {
+    //     alert("Username field must be filled!");
+    //     return false;
+    // /// /Check email
+    // var email = document.forms["form"]["email"].value;
+    // if(email == "") {
+    //     alert("Email field must be filled!");
+    //     return false;
+    // }
+}
+
+function checkName() {
+
+}
+
+function checkPassword() {
+    //Check Password
+    var password = document.forms["form"]["password"].value;
+    var confirmPassword = document.forms["form"]["confirm-password"].value;
+    if(password == "") {
+        alert("Password field must be filled!");
+        return false;
+    } else if(confirmPassword == "") {
+        alert("Confirm Password field must be filled!");
+        return false;
+    }
+}
+
+function checkPhone() {
+    //Check Phone
+    var phone = document.forms["form"]["phone"].value;
+}
\ No newline at end of file

model/user.php

@@ -31,7 +31,7 @@ class User {
     function getIdByUser($username) {
         $con = mysqli_connect('localhost','root','','projekers');
         mysqli_select_db($con, 'projekers');
-        $sql = "SELECT id FROM user WHERE username= '" . $username . "'";
+        $sql = "SELECT id FROM user WHERE username= '" . (string)$username . "'";
         $result = mysqli_query($con, $sql);
         mysqli_close($con);
         return $result;

view/edit-profile.php

@@ -8,10 +8,11 @@
     </script>
     <script src="../js/edit-profile.js"></script>
 </head>
-<body onpageshow="getUserProfile();">
+<body onload="getUserProfile();">
 <div class="container">
     <h1>EDIT PROFILE INFORMATION</h1>
-    <form action="../controller/edit-profile.php?id=<?php echo $_GET['id']?>" method="post" id="form">
+    <form action="../controller/edit-profile.php?id=<?php echo $_GET['id']?>"
+          method="post" id="form" name="editForm" onsubmit="checkAllInput()">
         <input type="hidden" id="userid" value="<?php echo $_GET['id'];?>">
         <div class="edit-image">
           <div class="div-profile-image">
@@ -21,7 +22,7 @@
             <label>Update profile picture</label>
             <br />
             <br />
-            <input type="file" name="image-file" value="browse..">
+            <input type="file" name="image-file" value="browse.." id="image-file">
           </div>
         </div>
         <div>
@@ -36,7 +37,10 @@
           <div class="edit-data">
             <label class="form-label">Status Driver</label>
             <div class="checkbox">
-                <input type="checkbox" name="driver" id="driver">
+                <label class="switch">
+                    <input type="checkbox" name="driver" id="driver">
+                    <span class="slider"></span>
+                </label>
             </div>
           </div>
         </div>

view/register.php

@@ -16,7 +16,7 @@
             <br>
             <br>
             <div class="form-input">
-                <form action="../controller/register.php" method="post">
+                <form action="../controller/register.php" method="post" name="registerForm" onsubmit="return checkAllInput()">
                     <div class="user-input">
                         <div class="label-input">Your Name</label></div>
                         <div class="text-input"><input type="text" name="full-name" id="full-name"></div>