www.webdeveloper.com
Results 1 to 4 of 4

Thread: HELP! Multi-forms and making sure fields are filled?

  1. #1
    Join Date
    Mar 2011
    Posts
    3

    HELP! Multi-forms and making sure fields are filled?

    Hi there

    I'm running two different forms on one page.Each form goes to a different place - one form does stuff on a different server and one form does stuff on the same server.

    This is being accomplished by using the following script (found here on WebDeveloper)

    HTML Code:
    <script language='javascript'>
    <!--
    function doit()
    {
    document.form1.submit();
    document.form2.submit();
    }
    -->
    
    </script>
    </head>
    The first form starts like this:

    HTML Code:
                <form id='form1' name='form1' action="http://www.coolcart.net/shop/coolcart.aspx/starkeepsakes" method='POST'>
    The second form starts like this:

    HTML Code:
                            <form id='form2' name="form2" method="POST" action="attachscript.php" enctype="multipart/form-data" target='_blank'> 
    There is no submit function in the forms.

    After the two forms are listed, there's one link that processes both forms at the same time when clicked:

    HTML Code:
                <div align="center"><a href='javascript:doit()'>Click Here To Submit</a></div>
    Here's the good news: THIS WORKS. This is not the problem.

    The problem is my client wants most/all of the content in form2 to be filled out. If the fields are not filled out, then something happened that says in effect "yo. fill that out!"

    I've tried to use javascript validation scripts and they don't work. Presumably because they depend upon

    HTML Code:
    <input type="submit" name="submit">
    Which is NOT how the form is told to post.

    So.... Any ideas? The client is FREAKING that "something so simple" (her words, not mine) can't be done.

    Thanks!

  2. #2
    Join Date
    Dec 2002
    Location
    St. Louis, MO, USA
    Posts
    1,582
    Most clients haven't got a clue as to what is easy, much less what is feasible.

    This is possible, though. You just have to put the form validation in your doit() function, and use the .submit() only when all is correct.

    If you just want to make sure that a text field or textarea or password field has content, check for length.
    Code:
    document.form1.fieldName.value.length > 0;
    Select elements use selectedIndex (first option is position 0).
    Code:
    document.form1.selectName.selectedIndex > 0;
    Checkbox and radio use .checked. If there are more than one with the same name/id, the first is position 0.
    Code:
    document.form1.checkRadio[0].checked == true;
    Don't use "javascript:doit();", use onclick="return doit();" to call the function.

    I recommend setting a variable called warn at the start; anything incorrect, use "warn += ' error message ';" and if warn does not = "", then fail the submit, otherwise "document.form1/2.submit();"

    ^_^

  3. #3
    Join Date
    Mar 2011
    Posts
    3
    So it would be

    HTML Code:
    <!--
    function doit()
    {
    document.form1.fieldName.value.length > 0;
    document.form1.submit();
    document.form2.fieldName.value.length > 0;
    document.form2.submit();
    }
    -->
    
    </script>
    If I was just worried about text fields?

    Don't use "javascript:doit();", use onclick="return doit();" to call the function.
    I'm scratching my head at that one. Tried using onclick="return doit();" in place of onclick="return checkEval();" but that didn't work. Tried using a submit button as well but still no go.

    Sorry - I must be an idiot this morning.
    Last edited by chrisjpopp; 03-16-2011 at 10:18 AM.

  4. #4
    Join Date
    Dec 2002
    Location
    St. Louis, MO, USA
    Posts
    1,582
    Code:
    <!--
    function doit()
    {
    // Put form validation in front of both.
    var warn = "";
    var df1 = document.form1, df2=document.form2;
    if(df1.fieldName.value.length == 0) {
      warn += "Please enter a value in form1 fieldName.\n";
      }
    if(df2.fieldName.value.length == 0) {
      warn += "Please enter a value in form2 fieldName.\n";
      }
    if(warn == "") {df1.submit(); df2.submit(); }
    else {alert(warn); return false; }
    }
    //--> //Gotta hide the closing HTML comment - it's not JS.
    This checks both forms; if either form is incorrect, it will not submit either - if both are correct, it will submit both.

    HTML Code:
    <div align="center"><a href="javascript:void(0);" onclick="return doit();">Click Here To Submit</a></div>
    This is a more proper way to use the anchor tag. Some JS guys will disagree, saying that the href should be "#" and add " return false;" to the end of the onclick. It's 6 of one, half a dozen of the other. "javascript:void(0);" for the href will prevent the native action of the anchor - "#" will scroll to the top, but the " return false;" at end of onclick will prevent the scroll.

    ^_^

Thread Information

Users Browsing this Thread

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

Tags for this Thread

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