Keranjang Coding : product


?>

Remember Me Javascript Form Login





     Kembali lagi dengan matadeveloper.com, kali ini matadeveloper ingin menjalskan bagaimana kinerja remember me untuk mengingat inputan saatkita memasukkan username dan password kita saat sedang login, proses ini membantu kita apabila kondisinya kita membutuhkan berulang kali login aplikasi dalam satu harinya, pastinya ribet donk kalau mesti nginputkan username dan passwordnya terus, tapi tidak disarankan untuk aplikasi seperti mobile banking menggunakan proses ini karena sangat berbahaya, anonymous dengan mudah menginspect halaman komputer kita untuk mendapatkan username maupun password kita secara mudah.

Langsung saja kita masuk ke source codenya, untuk script html nya anda bis mengikuti nya seperti dibawah ini :

<!DOCTYPE html>
<html>
<head>
    <title>Remember Me</title>
</head>
<body>
<form name="form" action="" method="post" onsubmit="if (this.checker.checked) toMem(this)">
 <table border="0" cellpadding="0" cellspacing="3" align="center" width="460">
  <tr>
    <td width="170" align="right">
      Name:   
    </td>
    <td width="290">
     <input size="30" name="name" id="name">
    </td>
  </tr>
  <tr>
    <td width="170" align="right">
      E-mail:   
    </td>
    <td width="290">
     <input size="30" name="email" id="email">
    </td>
  </tr>

  <tr>
    <td width="170" align="right">
      Remember me?:   
    </td>
    <td width="290">
     <input type="checkbox" id="checker" name="checker">
    </td>
  </tr>
  <tr>
    <td colspan="2" align="center">
      <input type="submit" value="Submit"> 
      <input type="reset" value="Reset"> 
      <input type="button" onclick="delMem(this)" value="Delete Information">
    </td>
  </tr>
 </table>
</form>
</body>
</html>
<!-- Script From Matadeveloper.com -->

 

Selanjutnya letakkan coding javascript ini diatas tag </body> atau sebelum tag </body>

 

<script type="text/javascript">
/*
    Cookie script - Kharisma Maulana Pasaribu
*/

function newCookie(name,value,days) {
 var days = 10;   // the number at the left reflects the number of days for the cookie to last
                 // modify it according to your needs
 if (days) {
   var date = new Date();
   date.setTime(date.getTime()+(days*24*60*60*1000));
   var expires = "; expires="+date.toGMTString(); }
   else var expires = "";
   document.cookie = name+"="+value+expires+"; path=/"; }

function readCookie(name) {
   var nameSG = name + "=";
   var nuller = '';
  if (document.cookie.indexOf(nameSG) == -1)
    return nuller;
   var ca = document.cookie.split(';');
  for(var i=0; i<ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
  if (c.indexOf(nameSG) == 0) return c.substring(nameSG.length,c.length); }
    return null; }
function eraseCookie(name) {
  newCookie(name,"",1); }
function toMem(a) {
    newCookie('theName', document.form.name.value);     // add a new cookie as shown at left for every
    newCookie('theEmail', document.form.email.value);   // field you wish to have the script remember
}
function delMem(a) {
  eraseCookie('theName');   // make sure to add the eraseCookie function for every field
  eraseCookie('theEmail');
   document.form.name.value = '';   // add a line for every field
   document.form.email.value = ''; }
function remCookie() {
document.form.name.value = readCookie("theName");
document.form.email.value = readCookie("theEmail");
}
// Multiple onload function created by: Simon Willison
// http://simon.incutio.com/archive/2004/05/26/addLoadEvent
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
addLoadEvent(function() {
  remCookie();
});
</script>
    <!--  Script From Matadeveloper.com    -->

 

Demikian pembahasan kalai ini, semoga bermanfaat untuk pengembangan website lanjutan. komentar dibawah untuk bertanya lebih lanjut ....

Tags : javascript html

Sekilas Tentang Penulis


Kharisma Maulana Pasaribu,ST
Software Engineer | Fullstack Developer | Founder of Matadeveloper.com



Prev Post
Membuat Chart Jumlah User Di Laravel 6 D
Next Post
Memilih Text Editor Html