Results 1 to 3 of 3

Thread: Validating forms before sending by email

  1. #1
    Join Date
    Feb 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Validating forms before sending by email

    I recently wrote a script to validate a form before sending it. The code works in IE but not in Netscape. What am I doing wrong?

    Code below:
    <html>
    <title>javaTest</title>


    <script type="text/javascript">


    function SendMail()
    {
    var custname = MyData.customername.value
    var custaddress = MyData.address.value
    var custcity = MyData.city.value
    var custzip = MyData.zip.value
    var custdate = MyData.deldate.value

    if(custname < 1 || custaddress < 1 || custcity < 1 || custzip < 1 || custdate < 1)
    {
    alert("Please complete all of the fields in the form")
    }
    else
    {

    testmat()
    }
    }


    function testmat()
    {
    var custtime = MyData.deltime.value
    var custmat = MyData.material.value

    if(custtime < 1 || custmat < 1)
    {
    alert("Please complete all of the fields in the form")
    return false;
    }
    else
    {
    testqty()
    }

    }


    function testqty()
    {
    var custphone = MyData.phone.value
    var custqty = MyData.qty.value

    if(custphone < 1)
    {
    alert("Please complete form")
    return false;
    }
    else
    {
    if(custqty < 1)
    {
    alert("Please enter quantity")
    return false;
    }
    else
    {
    document.MyData.submit()

    }
    }
    }

    </script>
    <head>
    </head>

    <body>
    <FORM METHOD="POST" action=mailto:customerservice@alliedrecycle.com name="MyData" ENCTYPE="text/plan">

    <font color = "blue"> <b>

    <pre>
    Name: <input type="text" name="customername"><br>
    Address: <input type="text" name="address"><br>
    City: <input type="text" name="city"><br>
    Zip: <input type="text" name="zip"><br>
    Phone: <input type="text" name="phone"><br>
    Date: <input type="text" name="deldate"><br>
    Delivery Time: <input type="text" name="deltime"><br>
    Material: <input type="text" name="material"><br>
    Qty: <input type="text" name="qty"><br>

    <input type=button value="Send" onclick="SendMail()";>
    <input type=Reset value="Clear Form">
    </pre>

    </b>

    </form>
    </body>
    </html>


  2. #2
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by rhawk6012
    The code works in IE but not in Netscape. What am I doing wrong?
    You're using some of Microsoft's proprietary nonsense.

    In IE, you can access elements using the value of a name or id attribute. However, this is entirely non-standard and, in my opinion, a terrible feature.

    In your specific case, it's extremely easy to solve. I've produced a quick-and-dirty solution that shows the basics, but would probably require some alterations. I'll walk through the code you posted, making some comments and drawing some comparisons.

    <title>javaTest</title>
    Please understand that Java is very different from Javascript. They are different languages developed by different companies.

    function SendMail()
    In the code I posted, I passed an argument to the validation function. This argument contains a reference to the form, making it much easier to access the controls. Notice the call:

    HTML Code:
    <form ... onsubmit="return validation(this);">
    When the this operator is used within listeners, it refers to the element - the form in this case.

    if(custname < 1 || custaddress < 1 || custcity < 1 || custzip < 1 || custdate < 1)
    OK, that makes no sense. More importantly, it will fail to validate the entries properly. When a relational comparison (less-than/greater-than) is performed between a number and a string, the string is coerced to a number and then the comparison continues as normal. In most cases, the strings will be converted to NaN (not-a-number) which will result in a value of false for the comparison.

    The validation of user input should be performed using regular expressions. I included several simple regular expressions in the demo.

    <FORM METHOD="POST" action=mailto:customerservice@alliedrecycle.com name="MyData" ENCTYPE="text/plan">
    A couple of things here. The first is that your content type is wrong: it should be text/plain. The second, and more important point, is that forms which use the mailto: scheme are very unreliable. Forms are meant to send content to processing scripts. You should use one to e-mail the content. Your host should provide one, but if not you can find services for free on the Web.

    <pre>
    The pre element is meant to be used with source code or program output. That is, text which has already been laid-out. It should not be used to align elements. Use CSS to position elements instead (as per the demo).

    <input type=button value="Send" onclick="SendMail()";>
    That semicolon is in the wrong place. I'd also like to reiterate that it's better to validate forms based on the submit event, rather than on the submit button.

    </b>
    You didn't close the font element after this closing tag. However, you should be aware that the font element has long been deprecated in favour of style sheets. CSS provides a much richer way of formatting and laying-out HTML documents.

    Hope that helps,
    Mike

  3. #3
    Join Date
    Sep 2004
    Location
    Little Falls, Roodepoort, South Africa
    Posts
    421
    Thanks
    4
    Thanked 1 Time in 1 Post

    Default

    Hi

    This works as well

    <input type="hidden" name="require" value="Name,Email,Phone,Title,Comments">
    Very Best Rgds, Simonf :cool:
    __________________________________
    My Site | E-Mail Me

Bookmarks

Posting Permissions

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