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 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Apr 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Why does the form reload/clear after validation error?

    I am trying to create a form to allow people to submit support requests using a web form (before you ask I have access to CGI so am left with no alternative but to do it this way). Anyway, issue is that when the form is validated, when you acknowledge the alert, the for reloads/clears. How do I stop this from occuring?

    Thanks for any ideas .....

    <html>
    <head>
    <form name="servicerequest">
    <script language="JavaScript">
    function sendtheMail() {
    var frm = document.forms["servicerequest"];
    if (document.forms[0].Urgency.value == "") {
    alert("No urgency has been specified!");
    return false;
    }
    if (document.forms[0].Product.value == "") {
    alert("No product has been specified!");
    return false;
    }
    if (document.forms[0].Country.value == "") {
    alert("No member firm/country has been specified!");
    return false;
    }
    if (document.forms[0].Office.value == "") {
    alert("No office has been specified!");
    return false;
    }
    if (document.forms[0].PrimaryContact.value == "") {
    alert("No primary contact has been specified!");
    return false;
    }
    if (document.forms[0].PCPhone.value == "") {
    alert("The primary contact's office phone number has not been entered!");
    return false;
    }
    if (document.forms[0].PCMobile.value == "") {
    alert("The primary contact's mobile/cell phone number has not been entered!");
    return false;
    }
    if (document.forms[0].message.value == "") {
    alert("No details have been entered!");
    return false;
    }
    document.forms[0].action = "mailto:totallyclueless@abc.com" +
    "?subject=" +
    document.forms[0].Urgency.value;
    alert("You may now see a message informing you that this program will submit the form via e-mail, then another message confirming that you wish to continue. Please select OK, then Yes when prompted to allow the submission to proceed.");
    return true;
    }
    </script>
    </head>
    <body bgcolor="navy" text="white">
    <form method="post" enctype="text/plain">
    <p><b><font size="5">Service Request Form</font></b></p>
    <table border="0">
    <tr>
    <td align="right">
    <div align="left">
    <b>Urgency:</b></div>
    </td>
    <td><select name="Urgency" size="1" tabindex="1">
    <option value="High">High</option>
    <option value="Medium">Medium</option>
    <option selected value="Normal">Normal</option>
    </select></td>
    <td><b>Product</b>:*</td>
    <td><select name="Product" size="1" tabindex="2">
    <option value="Active Directory">Active Directory</option>
    <option value="Exchange">Exchange</option>
    <option value="Virus">Virus</option>
    </select></td>
    </tr>
    <tr>
    <td align="right">
    <div align="left">
    <b>Country:*</b></div>
    </td>
    <td><select name="Country" size="1" tabindex="3">
    <option value="Albania">Albania</option>
    <option value="Angola">Angola</option>
    </select></td>
    <td><b>Office:*</b></td>
    <td><input type="text" name="Office" size="27" tabindex="4" border="0"></td>
    </tr>
    <tr>
    <td align="right">
    <div align="left">
    <b>Primary Contact:*</b></div>
    </td>
    <td><input type="text" name="PrimaryContact" size="34" tabindex="5" border="0"></td>
    <td><b>Phone:*</b></td>
    <td><input type="text" name="PCPhone" size="27" tabindex="6" border="0"></td>
    </tr>
    <tr>
    <td align="right"></td>
    <td></td>
    <td><b>Mobile/Cell:*</b></td>
    <td><input type="text" name="PCMobile" size="27" tabindex="7" border="0"></td>
    </tr>
    <tr>
    <td align="right"></td>
    </tr>
    <tr>
    <td align="right">
    <div align="left">
    <b>Secondary Contact: </b></div>
    </td>
    <td><input type="text" name="SecondaryContact" size="34" tabindex="8" border="0"></td>
    <td><b>Phone:</b></td>
    <td><input type="text" name="SCPhone" size="27" tabindex="9" border="0"></td>
    </tr>
    <tr>
    <td align="right"></td>
    <td></td>
    <td><b>Mobile/Cell</b></td>
    <td><input type="text" name="SCMobile" size="27" tabindex="10" border="0"></td>
    </tr>
    <tr valign="top">
    <td align="right">
    <p align="left"><b>Details:*</b></p>
    <div align="left">
    <p>Please provide as much detail as possible including steps taken to isolate or resolve.</p>
    </div>
    </td>
    <td colspan="3"><textarea name="message" rows="11" cols="77" tabindex="11"></textarea></td>
    </tr>
    <tr valign="top">
    <td align="right">
    <div align="left">
    <b>Notes:</b></div>
    </td>
    <td colspan="3">
    <ul>
    <li>All fields marked with * are mandatory
    </ul>
    </td>
    </tr>
    </table>
    <hr>
    <input onclick="sendtheMail()" type="submit" value="Submit" tabindex="12"> <input type="reset" value="Clear">
    </form>
    </form>
    </body>

    </html>

  • #2
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Welcome here! First off, wrap your Javascript code in code tags [ code ] ... [ /code ] (no spaces).

    Couple of things that I saw:

    1. You have two forms. From what I can see, <form name="servicerequest"> is useless. On top of that, this form is being declared in the head... weird.

    2. Instead of calling sendMail() in the onClick event on the submit button, try moving it to the onSubmit event of your form (the one you shouldn't delete).

    See how that works for you.

    Sadiq.
    Last edited by sad69; 04-23-2004 at 06:56 PM.

  • #3
    Regular Coder
    Join Date
    Apr 2003
    Location
    Atlanta, GA
    Posts
    487
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The form is doing exactly what you instructed. You've specified no action attribute for your form. Sadiq is right, the first form tag (above your javascript - ??) is extraneous and needs to go. Also, I'd recommend moving the validation function call to the <form onsubmit=""> handler - it'll submit without validation if I hit the enter key.

    Specify an action attribute for your form, and you should be good to go.

  • #4
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well in the validation code TotallyClueless does specify the action there.. but yea, if you move the validation call to the onsubmit event, it should work.

    I'm not sure why it's resetting the form when there's an error but hopefully making those changes might help.

    Good luck,
    Sadiq.

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The reason the form resets is because of this line here:

    <input onclick="return sendtheMail()" type="submit" value="Submit" tabindex="12">

    I've included the missing element which will fix the problem. The form isn't truly resetting, the form is actually submitting back to the page which is then simply reloaded.
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #6
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Roy Sinclair
    The form isn't truly resetting, the form is actually submitting back to the page which is then simply reloaded.
    Hey now that makes good sense!

    Sadiq.

  • #7
    New to the CF scene
    Join Date
    Apr 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Fantastic - works a treat! Thanks very much!

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Don't fail to follow Sadiq's suggestion of moving the check to the onsubmit event of the <form> tag or removing the extraneous form tag from the head of your page.
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #9
    New to the CF scene
    Join Date
    Apr 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yep - got it. Thanks again to all.


  •  

    Posting Permissions

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