www.webdeveloper.com
Results 1 to 12 of 12

Thread: Enter button not working?

Hybrid View

  1. #1
    Join Date
    Jul 2004
    Posts
    6

    Enter button not working?

    I have a .js script to allow a v.simple password section to a website it consists of a html from and a .js file it works well however if you press the enter key not the submit button it doesnt work any1 have any idea why please!!!!


    html code

    <form name="login" method="post" action="">
    <table width="300" border="1" cellspacing="0" cellpadding="0" bordercolor="#1d4e91" height="150" bgcolor="#1C86D1">
    <tr>
    <td valign="bottom">
    <table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#1C86D1" align="center" height="130">
    <tr align="center">
    <td height="40">
    <div align="right"><font color="#FFFFFF" size="2" face="Verdana, Arial, Helvetica, sans-serif"><b>Username:</b></font></div>
    </td>
    <td height="40">
    <input type="text" name="username" size="20">
    </td>
    </tr>
    <tr align="center">
    <td height="40">
    <div align="right"><font color="#FFFFFF" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Password:</b></font></div>
    </td>
    <td height="40">
    <input type="password" name="password" size="20">
    </td>
    </tr>
    <tr align="center">
    <td colspan="2" align="center">
    <input type="button" value="Login!" onClick="Login()" name="button">
    <input type="reset" name="Reset" value="Clear">
    </td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    </form>


    and in a .js file i have

    <!-- Begin
    function Login(){
    var done=0;
    var username=document.login.username.value;
    username=username.toLowerCase();
    var password=document.login.password.value;
    password=password.toLowerCase();

    if (username=="test" && password=="test") { top.location="http://www.test.co.uk/testindex.html"; done=1; }
    if (done==0) { alert("Sorry, Your Log-in is Invalid. Please Try Again."); }
    }
    // End -->

  2. #2
    Join Date
    Nov 2003
    Location
    Aachen, Germany
    Posts
    4,090
    Hi!

    If you make your input type="button" an input type="submit" and call the function in the form tag (onsubmit="Login()") instead of onClick of the button, the function will also be executed, if enter is pressed.

    Cheers - Pit

    Edit: I hope, you don't use that for something important! Everybody can simply get the url of the page and go there.
    Last edited by Pittimann; 07-30-2004 at 10:28 AM.
    The perfect website, which isn't one: http://www.pit-r.de (completely re-designed)

    Bad news for many "important" members here: I am still alive.

  3. #3
    Join Date
    Jul 2004
    Posts
    6

    still not working

    many thanks for your prompt responce

    I have changed the code to

    <input type="submit" value="Login" onsubmit="Login()" name="login">

    but it still doesnt seen to work!
    am i missing something???

  4. #4
    Join Date
    Nov 2003
    Location
    Aachen, Germany
    Posts
    4,090
    Hi!

    Yes, you are missing something. The onsubmit="Login()" has to go to the form tag - not to the input tag, just like I said.

    Cheers - Pit
    The perfect website, which isn't one: http://www.pit-r.de (completely re-designed)

    Bad news for many "important" members here: I am still alive.

  5. #5
    Join Date
    Jul 2004
    Posts
    6

    like this?

    hello Pit

    so should it be

    <form name="login" method="post" action="" onsubmit="Login()">
    <table cellpadding="0" cellspacing="0">
    <tr>
    <td><table border="0" cellpadding="0" cellspacing="0" align="center" >
    <tr align="center">
    <td><div align="right"><b>Username:</b></div></td>
    <td><p>
    <input type="text" name="username" size="20">
    </p></td>
    </tr>
    <tr align="center">
    <td><div align="right"><b>Password:</b></div></td>
    <td><p>
    <input type="password" name="password" size="20">
    </p></td>
    </tr>
    <tr align="center">
    <td colspan="2" align="center"><input type="submit" value="Login" name="login">
    <input type="reset" name="Reset" value="Clear">
    </td>
    </tr>
    </table></td>
    </tr>
    </table>
    </form>

  6. #6
    Join Date
    Nov 2003
    Location
    Aachen, Germany
    Posts
    4,090
    Hi!

    Almost! My fault: I forgot the return part. A working example:
    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <
    html>
    <
    head>
    <
    title>Untitled</title>
    <
    script language="JavaScript" type="text/javascript">
    <!--
    function 
    Login(){
    var 
    done=0;
    var 
    username=document.login.username.value;
    username=username.toLowerCase();
    var 
    password=document.login.password.value;
    password=password.toLowerCase();
    if (
    username=="test" && password=="test") { top.location="http://www.test.co.uk/testindex.html"done=1; }
    if (
    done==0) { alert("Sorry, Your Log-in is Invalid. Please Try Again."); return false;}
    }
    //-->
    </script>
    </head>
    <body>
    <form name="login" method="post" action="" onsubmit="return Login()">
    <table cellpadding="0" cellspacing="0">
    <tr>
    <td><table border="0" cellpadding="0" cellspacing="0" align="center" >
    <tr align="center">
    <td><div align="right"><b>Username:</b></div></td>
    <td><p>
    <input type="text" name="username" size="20">
    </p></td>
    </tr>
    <tr align="center">
    <td><div align="right"><b>Password:</b></div></td>
    <td><p>
    <input type="password" name="password" size="20">
    </p></td>
    </tr>
    <tr align="center">
    <td colspan="2" align="center"><input type="submit" value="Login" name="login">
    <input type="reset" name="Reset" value="Clear">
    </td>
    </tr>
    </table></td>
    </tr>
    </table>
    </form>
    </body>
    </html> 
    Cheers - Pit
    The perfect website, which isn't one: http://www.pit-r.de (completely re-designed)

    Bad news for many "important" members here: I am still alive.

  7. #7
    Join Date
    Jul 2004
    Posts
    6

    still not working????

    Hi Pit

    thanks for all your help but it still is not working?

    i even tried to copy and paste your code and thats not working either?

    and even the button is not working!

    any ideas?

  8. #8
    Join Date
    Jul 2004
    Posts
    6

    well its 3/4 working!

    1) if username and password is correct and you use the button it works fine

    2) if the code is wrong and you use the buttons the error message shows correctly

    3) if the code is wrong and you use the enter key the error message shows correctly

    4) the only problem is if the code is correct and you use the enter key then it just loads the same page again so effectively just clears the form



    Using this code:

    <form name="login" method="post" action="" onsubmit="return Login()">
    <table cellpadding="0" cellspacing="0">
    <tr>
    <td><table border="0" cellpadding="0" cellspacing="0" align="center" >
    <tr align="center">
    <td><div align="right"><b>Username:</b></div></td>
    <td><p>
    <input type="text" name="username" size="20">
    </p></td>
    </tr>
    <tr align="center">
    <td><div align="right"><b>Password:</b></div></td>
    <td><p>
    <input type="password" name="password" size="20">
    </p></td>
    </tr>
    <tr align="center">
    <td colspan="2" align="center"><input type="button" value="Login" onClick="Login()" name="Button">
    <input type="reset" name="Reset" value="Clear">
    </td>
    </tr>
    </table></td>
    </tr>
    </table>
    </form>

  9. #9
    Join Date
    Nov 2003
    Location
    Aachen, Germany
    Posts
    4,090
    Hi!

    Sorry again. IE needs another return false (Mozilla not) in this line:
    top.location="http://www.test.co.uk/testindex.html";return false;}

    M$

    Cheers - Pit
    The perfect website, which isn't one: http://www.pit-r.de (completely re-designed)

    Bad news for many "important" members here: I am still alive.

  10. #10
    Join Date
    Jul 2004
    Posts
    6
    many thanks works 100% now

    PS also needs that on safari (os x)

    many thanks again!!!!!!!!!

  11. #11
    Join Date
    Nov 2003
    Location
    Aachen, Germany
    Posts
    4,090
    Hi!

    You're welcome!
    PS also needs that on safari (os x)
    And I thank YOU for that information.

    Sorry again for the inconvenience.

    Regards - Pit
    The perfect website, which isn't one: http://www.pit-r.de (completely re-designed)

    Bad news for many "important" members here: I am still alive.

  12. #12
    Join Date
    May 2012
    Posts
    2

    Similar problem

    I am having a similar problem. Can you help?

    I am having difficulty using the "tab" key to navigate the buttons on a password form I am building for my site.

    I found a beautiful piece of code, which works wonderfully, with the exception that I cannot tab to the "login" or "reset" buttons on the form. Tabbing through the fillable input fields works fine, but tabbing to the buttons does not work. Also, the "login" button does not function on a "return" keypress.

    I have tried using the "tabindex" attribute, and while this works for the input fields, it does not have any effect on the "Login" or "Reset" buttons. I have tried changing the input type from "login" to "submit", and I have tried changing "onclick" to "onsubmit" (or "onkeypress"), but with these changes, the code doesn't function properly. The "return" key might function, but then the code does not. Never both at the same time.

    I have searched all over the web for a solution to no avail. I must admit I am fairly new to html and I do not have the know-how to overhaul the code I'm working with, so I'm asking for help. Does anybody have a solution to my problem?

    I want to use the below code, but be able to tab through the input fields, the "login" and "reset" buttons and have these buttons function on a "return" keypress.

    Here's the code:

    <!--

    <SCRIPT LANGUAGE="JavaScript">

    //---------------------------------
    //LOGIN SCRIPT BY ALEX KEENE 1997
    //INFO@FIRSTSOUND.COM
    //---------------------------------

    function Getstats()
    {
    window.status=('Attempting to Login to user area.')

    var AccId;
    var iName;
    AccId = document.iAccInput.iAccID.value
    iName = document.iAccInput.iName.value

    if (AccId == "" || iName == "")
    {
    alert('\nERROR\nYou must enter ALL Details,\nto View your statistics.\n');
    window.status=('Missing data or Invalid. Check spelling and Ensure Names are in Correct Case.')
    }
    else
    {

    var location=("pw" + iName + AccId + ".html");
    this.location.href = location;
    window.status=(' Verifying: ' + iName + '-' + AccId + ' Please wait........');
    }
    }

    </SCRIPT>

    </HEAD>

    <div id="main_text">
    <h2 class="style3">REEL</h2>
    <p class="style1">&nbsp;</p>
    <p>&nbsp;</p>
    <FORM NAME="iAccInput">
    <LEFT>
    <TABLE BORDER="0" border-color=#000000>
    <TR>
    <TD ALIGN="RIGHT" class="style1"><p>Client Name:<br />
    Password:</p></TD>

    <TD><INPUT tabindex="1" TYPE="TEXT" NAME="iName" MAXLENGTH="15"><br />
    <input tabindex="2" type="password" NAME="iAccID" MAXLENGTH="15"></TD>
    <TD><input tabindex="3" TYPE="button" VALUE=" Login " onClick="Getstats()" HEIGHT="40" WIDTH="50"><BR />
    <input tabindex="4" TYPE="RESET" VALUE=" Reset " onClick="window.status=('RESET: Please enter your CLIENT NAME and PASSWORD.')" WIDTH="50">
    </TD></TR></TABLE></LEFT>
    <form/>

    -->


    Again, I want to be able to tab through the input fields, the "login" and "reset" buttons and have these buttons function on a "return" keypress. There's gotta be a way. Please help!

    Thanks!
    Michael

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles