JezK
Edit File: index.php
<!doctype html> <html lang="en"> <head> <title>Detailing Edition - Login</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="icon" type="image/png" href="./images/fav.png"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@200;400;800&family=Mulish:wght@300;400;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.7/css/all.css"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <link rel="stylesheet" href="./userstyles/userstyles.css"> <script src="./js/validations.js"></script> </head> <body class="login-section"> <section> <div class="container-fluid"> <div class="row no-gutters"> <div class="col-md-6 d-none side-image p-0"> <img src="./images/logo.png" id="logo" class="img-fluid" /> </div> <div class="col-md-6 form-container"> <div class="login-contents"> <h3 class="login-heading">Login</h3> <div class="form-style"> <form id="login-form"> <div class="form-group pb-2 position-relative"> <label for="phone" class="form-label">Phone number</label> <input type="phone" class="form-control" id="phone" name="phone" placeholder="Phone number"> <p class="error phone_error"></p> <div class="error phoneerror"></div> </div> <div class="form-group pb-2 position-relative"> <label for="password">Password</label> <!-- <input type="password" class="form-control" id="password" value="" placeholder="Enter password" > --> <input type="password" placeholder="Password" class="form-control" name="password" id="password"> <span class="toggle-icon"><i class="fa fa-eye"></i></span> <a href="forgotpassword.php" style="color:white;float:right;" class="mt-2">Forgot Password?</a> <div class="error passworderror"></div> <p class="error password_error"></p> </div> <div class="error loginerror"></div> <div class="my-2 d-flex justify-content-center"> <button type="submit" class="de-btn-fill" onclick="return validateUserLogin();" name="login">Login</button> </div> </form> </div> <div class="login">Dont have an account <br> <h5><a href="register.php">Register</a></h5> </div> </div> </div> </div> </div> </section> <?php include "./scripts.php"; include "./App/userObject.php"; ?> <script> let baseUrl = "<?php echo $baseUrl; ?>" $(document).ready(function() { $('.toggle-icon').click(function() { var input = $('#password'); if (input.attr('type') === 'password') { input.attr('type', 'text'); $(this).find('i').removeClass('fa-eye').addClass('fa-eye-slash'); } else { input.attr('type', 'password'); $(this).find('i').removeClass('fa-eye-slash').addClass('fa-eye'); } }); $('#login-form').submit(function(event) { event.preventDefault(); let phone = $('#phone').val(); let password = $('#password').val(); $.ajax({ url: 'App/loginApp.php', method: 'POST', data: { name: 'login', phone: phone, password: password, }, success: function(response) { console.log(response,'response') if (response == 1) { location.replace('home.php'); } else if (response == -1) { toastr.warning("Account Not Activated") token = btoa(phone); location.replace('otpverification.php?token='+token+'&verifyStatus='+1); } else { toastr.warning(response) } } }); }); }); $('#logo').click(function() { location.replace('index.php'); }) </script> </body> </html>