Making simple Password Form work with button AND when clicking enter

**dmwhipp** · 02-20-2014, 11:57 PM

Hi,
My client has a staff page which they wish to offer very simple password protection on. I'm using a simple javascript with a hex encoded password and have the set the page up to their specs. They are fully aware that this is NOT secure. Their goal is to have staff pages with items that may not be ready for the general public or to present to their board members and this should suffice.

This is the sample page they gave me as a basic template: http://floridaimpactstaff.tumblr.com/

Here is the page I created for them: http://www.flimpact.org/testlogin.html. The script works perfectly if you enter the password and then click the Login button - a popup alert informs you the password is correct and you move on to the next page. However, if you type the correct password and click Enter instead of clicking the Login in button, you get the alert, but it does NOT forward you to the page.

You can test it yourself - the password is: easy

I've added this script to the head, but still no luck:

Code:

<script type="text/javascript">
$("input").keypress(function(event) {
    if (event.which == 13) {
        event.preventDefault();
        $("form") logIn();
    }
});
</script>

Any help would be appreciated.
Thanks,
Deborah

**Deadweight** · 02-21-2014, 03:05 AM

Try -

replace:

Code:

parent.location="http://www.flimpact.org/1staff.html";

with

Code:

window.location.assign("http://www.flimpact.org/1staff.html");

**dmwhipp** · 02-21-2014, 03:24 AM

I've changed the coding to your suggestion, but still the same issue.

**Deadweight** · 02-21-2014, 03:32 AM

Ok give me a moment. Ill remake it from the beginning.

**dmwhipp** · 02-21-2014, 04:32 AM

Thanks... I finally got it working with help from users at stackoverflow: http://www.flimpact.org/testlogin4.html, but I'll be deleting the test page soon.

In case anyone else ever needs a very low-security password protected page, below is the coding that worked. Just remember to change YOUR_PAGE_HERE with the url of the page you want to password protect.

Code:

    <!DOCTYPE html>
    <html>
    <head>
    <title>Login</title>
    <meta name="description" content="Staff Login.">
    <meta name="keywords" content="login page">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <link rel="stylesheet" type="text/css" href="/stylesheet.css">
    
    <script type="text/javascript">
    //Powered by DCScript
    function logIn() {
    var pass=unescape("%65%61%73%79");
    switch (document.lform.login.value)
    {
    case pass:
    alert("Valid password. Access granted");
    parent.location="YOUR_PAGE_HERE";
    return false; 
    break;
    default : alert("Invalid password. Please try again.");
       }
    }
    //Encoding/Decoding hex can be done at http://nickciske.com/tools/hex.php
    </script>
    
    <script type="text/javascript">
    $('.input').keypress(function (e) {
      if (e.which == 13) {
        $('form#lform').submit();
        return false;    //<---- Add this line
      }
    });
    </script>
    
    </head>
    
    
    <body>
    
    
    <center>
    <form name="lform" id="lform" onsubmit="return logIn()">
    <input type="password" class="passwordinput" size="40" name="login" id="login"><br>
    <input type="button" class="loginbutton" value="Login" onClick="logIn()">
    </form>
    </center>
    
    </body>
    </html>