khirulnizam

login.html upnm apps

Mar 1st, 2019
323
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <div class="row">
  2.     <div class="col-sm-12 mt-5">
  3.         <h1 align="center"><i class="fas fa-users"></i><br /><span class="app_name">My Application</span></h1>
  4.     </div>
  5. </div>
  6. <div class="row">
  7.     <div class="col-sm-12 mt-5">
  8.         <form id="form-login">
  9.             <div class="form-group">
  10.                 <label>Email:</label>
  11.                 <input type="text" class="form-control" name="email" id="email">
  12.             </div>
  13.             <div class="form-group">
  14.                 <label>Password:</label>
  15.                 <input type="password" class="form-control" name="password" id="password">
  16.             </div>
  17.             <div class="form-group">
  18.                 <button class="form-control btn btn-success" id="btn-login">Login</button>
  19.             </div>
  20.         </form>
  21.     </div>
  22. </div>
  23.  
  24. <!-- script goes here -->
  25. <script>
  26.     $(function () {
  27.         // button login
  28.         $("#btn-login").on('click', function (e) {
  29.             e.preventDefault(); // Disabled default form behavior
  30.  
  31.             // send data to server and get response
  32.             $.ajax({
  33.                 url: apiServer + "login",
  34.                 type: "post",
  35.                 dataType: "json",
  36.                 data: $("form#form-login").serialize(),
  37.                 success: function (result) { // return code 200 (success)
  38.                     //console.log(result); // check return message from server
  39.                     //console.log(result.data.api_token); // read return message
  40.  
  41.                     // save result data to local storage
  42.                     storage.setItem("api_token", result.data.api_token); // use as authentication code when request data from server
  43.                     storage.setItem("user_id", result.data.id);
  44.                     storage.setItem("user_name", result.data.name);
  45.                     storage.setItem("user_email", result.data.email);
  46.  
  47.                     // redirect user to dashboard
  48.                     storage.setItem("activePage", "dashboard");
  49.                     location.href = "content.html";
  50.                 },
  51.                 error: function (result, ajaxOptions, thrownError) { // return code 422 (error)
  52.                     //console.log("Error: " + result.responseText); // check return message from server
  53.                     alert("Incorrect login information. Please check your credentials and try again.");
  54.                 }
  55.             });
  56.             return false;
  57.         });
  58.  
  59.     });
  60. </script>
Advertisement
Add Comment
Please, Sign In to add comment