Scribd Logo
Upload

Welcome to Scribd!

  • Local Storage

    Uploaded by

    Taufik Hidayat
    6K views2 pages
    The document describes a login and registration form that uses local storage to save user credentials. It includes HTML for a login form and registration form. There are also JavaScript functions defined to store user data in local storage on registration and check local storage on login to display a welcome message.

    Original Description:

    free download this file

    Original Title

    Local Storage free download

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document describes a login and registration form that uses local storage to save user credentials. It includes HTML for a login form and registration form. There are also JavaScript functions defined to store user data in local storage on registration and check local storage on login to display a welcome message.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    6K views2 pages

    Local Storage

    Uploaded by

    Taufik Hidayat
    The document describes a login and registration form that uses local storage to save user credentials. It includes HTML for a login form and registration form. There are also JavaScript functions defined to store user data in local storage on registration and check local storage on login to display a welcome message.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 2

    LOCAL STORAGE

    <div class="popup">
    <h2>Welcome Guest!</h2>
    <p>Please enter your login and password here</p>
    <div>
    <label for="email">Login </label>
    <input type="text" id="username" value="" />
    </div>
    <div>
    <label for="password">Password</label>
    <input type="password" id="password" value="" />
    </div>
    <input type="button" value="Log In" />
    <a class="close" href="#close"></a>
    </div>
    <div class="popup">
    <h2>Register</h2>
    <p>Please enter your details here</p>
    <div>
    <label for="email">Login (Username)</label>
    <input type="text" id="username" value="" />
    </div>
    <div>
    <label for="pass">Password</label>
    <input type="password" id="password" value="" />
    </div>
    <button onclick="store()" type="button">Sign up </button> or <a href="#login_form"
    id="login_pop">Log In</a>
    <a class="close" href="#close"></a>
    </div>
    </div>
    While the functions for the signup and sign in are as follows
    //function to store user name and password
    function store () {
    var inputUsername= document.getElementById("username");
    var inputPassword= document.getElementById("password");
    localStorage.setItem("username", inputUsername.value);
    localStorage.setItem("password", inputPassword.value);
    });
    //function to sign in
    function login() {
    var inputUsername = localStorage.getItem("username");
    var inputPassword = localStorage.getItem("password");
    if (username != "undefined" || username != "null" || password != "undefined" || password !="null")
    {
    document.getElementByID('welcomeMessage').innerHTML = "Welcome " + username + "!";
    } else
    document.getElementById('welcomeMessage').innerHTML = "Hello!";
    }

    MEMBUAT PRINT PRIVIEW

    Pertama kita membuat halaman preview.php. pada halaman preview kita masukkan script berikut
    setela <body>. hal ini juga preview.php dipanggil maka akan keluar dialog print:
    <body onLoad=window.print()>
    Selanjutnya kita menulis script php dan SQL Query untuk menampilkan data dari databese yang
    akan dicetak. saya contohkan berikut ini:
    <table border=1 width=90%>
    <tr>
    <th width=3%>No</th>
    <th width=25%>Nama</th>
    <th width=32%>Alamat</th>
    <th width=17%>Kelas</th>
    </tr>
    <?php
    include koneksi.php;
    $sql=mysql_query(SELECT * FROM siswa);
    while($data=mysql_fetch_array($sql)){
    echo<tr><td width=15 id=view>$no</td>
    <td>$data[nama]</td>
    <td>$data[alamat]</td>
    <td>$data[kelas]</td>
    </tr>;
    $no++;
    } ?>
    Maka data yang akan dicetak berupa tabel berisi data siswa dengan kolom no, nama, alamat, dan
    kelas.
    2. Selanjutnya kita memberi tombol print dan preview pada halaman index.php atau yang mau
    diberi tombol print. Kali ini saya contohkan halaman index.php.
    kita masukkan kode script berikut sebelum tag </head>.
    <script type=text/javascript>
    var s5_taf_parent = window.location;
    function popup_print(){
    window.open(preview.php,page,toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resi
    zable=0,width=750,height=600,left=50,top=50,titlebar=yes)
    }
    </script>
    Kemudian kita masukkan perintah untuk membuat tombol print dan preview dengan kode berikut
    pada tubuh program(setelah tag <body>):
    <input type=button value=Print dan Preview onClick=popup_print() />

    You might also like