Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Jun 2004
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    2 Onsubmit functions in same form, HOW?

    I have a script in which I would like to disable the submit button to prevent multiple submission,
    Ive found a script that will do this for me the problem is my form already have an onsubmit function pertaining to passwords
    Is there a way I can still incorporate the two without problems..


    Here is the form and the code I would like to incorporate..

    The Form

    Code:
    <html>
    
    <head>
    <meta http-equiv="Content-Language" content="en-us">
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <meta name="GENERATOR" content="Microsoft FrontPage 4.0">
    <meta name="ProgId" content="FrontPage.Editor.Document">
    <title>Member Login</title>
    
    <style>
    <!--
     INPUT.button { background-color:#eeeeee;font:verdana;font-weight:bold;color:#000080;font-size:10pt; }
    -->
    </style>
    
    <style type="text/css"><!-- #surveyDiv {position:absolute; height:1; width:1; top:0; left:0;} --></style>
    
    
    </head>
    
    <body>
    
    <form method="POST" action="login.cgi" name=form1 onSubmit="return SetPass();">
    <input type=hidden name=command value="login">
    <div align="center">
      <center>
    <table cellpadding="0" width="100%" height="100%" border="0" cellspacing="0"><tr><td valign="middle" align="center">
      <table border="1" cellpadding="5" cellspacing="0" bordercolorlight="#000000" bordercolordark="#FFFFFF" bgcolor="#FFFFFF">
        <tr>
          <td bgcolor="#000000">
            <div align="center">
    
                    <div align="center">
                      <table border="0" cellpadding="2" cellspacing="0">
                        <tr>
                          <td align="center" colspan="2">
                                  <table border="0" width="100%" cellspacing="0" cellpadding="0">
                                    <tr>
                                      <td width="100%">
                                        <table border="1" cellpadding="5" cellspacing="0" bordercolorlight="#000000" bordercolordark="#FFFFFF" bgcolor="#FFFFFF" width="100%">
                                          <tr>
                                            <td width="100%" valign="middle" align="right"><p align="center"><font color="#FFFFFF" face="Tahoma"><b><img border="0" src="http://www.cgiscript.net/spacer.gif" width="1" height="1"><img border="0" src="login.jpg" width="360" height="272">&nbsp;</b></font></p>
                                            </td>
                                          </tr>
                                        </table>
                                      </td>
                                    </tr>
                                  </table>
                          </td>
                        </tr>
                        <tr>
                          <td bgcolor="#C09133">
                            <table border="0" cellpadding="5" cellspacing="0" bordercolorlight="#000000" bordercolordark="#FFFFFF" bgcolor="#FFFFFF" width="100%">
                              <tr>
                                <td width="100%" valign="middle" align="center" bgcolor="#C09133">
                                  <table border="0" cellspacing="0" cellpadding="3">
                                    <tr>
                                      <td align="right" bgcolor="#C09133"><font size="2" face="verdana,arial,helvetica"><b>Username</b></font><font face="verdana,arial,helvetica"><b><font size="2">:
                            </font></b></font></td>
                                      <td bgcolor="#C09133"><input type="text" name="UserName" size="30"></td>
                                    </tr>
                                    <tr>
                                      <td align="right" bgcolor="#C09133"><font face="verdana,arial,helvetica"><b><font size="2">Password:
                            </font></b></font></td>
                                      <td bgcolor="#C09133"><input type="password" name="PassWord" size="30"></td>
                                    </tr>
                                    <tr>
                                      <td align="right" bgcolor="#C09133"><font face="verdana,arial,helvetica"><b><font size="2">Select Folder:
                            </font></b></font></td>
                                      <td bgcolor="#C09133"><select size="1" name="dir">
                                      in(options)
                                        </select></td>
                                    </tr>
                                  </table>
                                </td>
                              </tr>
                            </table>
                          </td>
                          <td valign="bottom" bgcolor="#C09133">
                            <font size="2">
                            <input CLASS="button" type="submit" value="Login" name="B1" style="font-size: 10px">
                            &nbsp;&nbsp;&nbsp; </font>
                          </td>
                        </tr>
              </center>
                        <tr>
                          <td align="center" colspan="2" bgcolor="#000000">
                                  <table border="0" width="100%" cellspacing="0" cellpadding="0">
                                    <tr>
                                      <td width="100%">
                                        <table border="1" cellpadding="5" cellspacing="0" bordercolorlight="#000000" bordercolordark="#FFFFFF" bgcolor="#FFFFFF" width="100%">
                                          <tr>
                                            <td width="100%" valign="middle" align="right" bgcolor="#C09133"><p align="center"><img border="0" src="http://www.cgiscript.net/spacer.gif" width="1" height="1"></p>
                                            </td>
                                          </tr>
                                        </table>
                                      </td>
                                    </tr>
                                  </table>
                          </td>
                        </tr>
                      </table>
                    </div>
    
          </div>
        </td>
      </tr>
      </table>
    </td></tr></table>
    </div>
    </form>
    
    </body>
    <script language=javascript>
    document.form1.UserName.focus();
    function SetPass(){
    var UserName = document.form1.UserName.value;
    var PassWord = document.form1.PassWord.value;
    if(!UserName){
    alert("Error. Please enter a username");
    return false;
    }
    if(!PassWord){
    alert("Error. Please enter a password");
    return false;
    }
    document.cookie = "UserName="+UserName+";path=/";
    document.cookie = "PassWord="+PassWord+";path=/";
    return true;
    }
    </script>
    </html>
    Here's the Code for the submit once validation form
    (being placed in the head of the page)

    Code:
    <script>
    
    function submitonce(theform){
    //if IE 4+ or NS 6+
    if (document.all||document.getElementById){
    //screen thru every element in the form, and hunt down "submit" and "reset"
    for (i=0;i<theform.length;i++){
    var tempobj=theform.elements[i]
    if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset")
    //disable em
    tempobj.disabled=true
    }
    }
    }
    </script>
    And the required onsubmit function to be added to the Form

    Code:
    <form method="POST" onSubmit="submitonce(this)">

  • #2
    Regular Coder
    Join Date
    Nov 2002
    Location
    Manchester, UK
    Posts
    533
    Thanks
    4
    Thanked 1 Time in 1 Post
    you can either make a new function, eg:

    Code:
    function submitIt(ctrl)
    {
    SetPass();
    submitonce(ctrl);
    }
    }
    and put

    <form method="POST" onSubmit="return submitIt(this);">

    or use

    <form method="POST" onSubmit="submitonce(this); return SetPass();">

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    HomerUK is almost right except if the password is missing the user will be unable to submit again because the submitonce function has already disabled the submit button.

    I suggest you add a call to the submitonce function just before the "return true" in the SetPass function. Make sure you provide the form object in that call since the submitonce function requires it.
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #4
    Regular Coder
    Join Date
    Nov 2002
    Location
    Manchester, UK
    Posts
    533
    Thanks
    4
    Thanked 1 Time in 1 Post
    ah yes, didn't notice that!
    you think something like

    Code:
    function submitIt(ctrl)
    {
    if (SetPass()) {
    submitonce(ctrl);
    }
    }
    would work? if the setPass is returned true, it will then submit... would that work the same as you said?

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by homerUK
    ah yes, didn't notice that!
    you think something like

    Code:
    function submitIt(ctrl)
    {
    if (SetPass()) {
    submitonce(ctrl);
    }
    }
    would work? if the setPass is returned true, it will then submit... would that work the same as you said?
    You still need to return a value from the submitIt function reflecting the return value from the setpass function, otherwise the submit will occur even if the SetPass function tries to cancel it.

    For using an additional function the following would work:
    Code:
    function submitIt(ctrl)
    {
    var YeaOrNay = SetPass();
    if (YeaOrNay) {
    submitonce(ctrl);
    return YeaOrNay;
    }
    }
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,074
    Thanks
    0
    Thanked 256 Times in 252 Posts
    You can combine the two functions without an extra function.

    onsubmit="return SetPass() && submitonce(this)"

    For efficiency and consistency, you can also pass the form reference to the SetPass() function as submitonce() function did.

    onsubmit="return SetPass(this) && submitonce(this)"

    And then changing the SetPass to this:
    Code:
    function SetPass(frm){
        var UserName = frm.UserName.value;
        var PassWord = frm.PassWord.value;
        if(!UserName){
            alert("Error. Please enter a username");
            frm.UserName.focus();
            return false;
        }
        if(!PassWord){
            alert("Error. Please enter a password");
            frm.Password.focus();
            return false;
        }
        document.cookie = "UserName="+escape(UserName)+";path=/";
        document.cookie = "PassWord="+escape(PassWord)+";path=/";
        return true;
    }
    I further improved the function by changing/adding appropriate codes.
    Escaping the cookie value preserves the special characters in it.
    If you are also using javascript to retrieve the cookie, you should unescape() the value.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________


  •  

    Posting Permissions

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