Textarea Form Validation

Discussion in 'Javascript' started by Openside, Mar 4, 2006.

  1. Openside

    Openside Guest

    Hi,

    I am fairly green when it comes to JavaScript. I have the Form
    Validation below for 3 textarea fields. It works fine, but if none of
    the fields are filled out then 3 consequtive alert boxes pop up.How can
    I modify the script to only prompt the user one field at a time?

    The Script I have is:

    <script language="JavaScript">
    <!--

    function valform ( )
    {
    valid = true;

    if ( document.recipeform.directions.value == "" )
    {
    alert ( "Please enter the directions of the recipe." );
    valid = false;
    }

    if ( document.recipeform.description.value == "" )
    {
    alert ( "Please enter the description of the recipe." );
    valid = false;
    }

    if ( document.recipeform.ingredients.value == "" )
    {
    alert ( "Please enter the ingredients of the recipe." );
    valid = false;
    }

    return valid;
    }

    //-->
    </script>

    thanks,

    Openside
     
    Openside, Mar 4, 2006
    #1
    1. Advertising

  2. You can use something like this:

    <script language="JavaScript">
    <!--

    function valform () {
    var msg = '';

    if ( document.recipeform.directions.value == "" ) {
    msg .= "Please enter the directions of the recipe.\n";
    }


    if ( document.recipeform.description.value == "" ) {
    msg += "Please enter the description of the recipe.\n";
    }


    if ( document.recipeform.ingredients.value == "" ) {
    msg .= "Please enter the ingredients of the recipe.\n";
    }

    if(msg != '') {
    alert(msg);
    return false;
    }
    return true;
    }

    //-->
    </script>
     
    TheBigSearchEngine, Mar 4, 2006
    #2
    1. Advertising

  3. TheBigSearchEngine wrote:
    ^^^^^^^^^^^^^^^^^^
    Posting with such a ridiculous "name" does not increase credibility of a
    poster. Posting such ridiculous nonsense as below is only another proof
    to justify this preconception.

    > You can use something like this:


    But you should not. Not at all.

    > <script language="JavaScript">


    The `language' attribute is deprecated, the `type' attribute is required in
    HTML 4:

    <script type="text/javascript">

    > <!--


    Trying to comment out `script' element content has always been nonsense.

    > function valform () {
    > var msg = '';
    >
    > if ( document.recipeform.directions.value == "" ) {


    Standards compliant referencing would be

    if (document.forms['recipeform'].elements['directions'].value == "")
    {

    However, it is more efficient and less error-prone if one passes the `this'
    reference in the `onsubmit' event handler attribute value to the validation
    method, and use its named argument instead. Say if the method was called
    with

    <form ... onsubmit="return valform(this);">

    and defined as

    function valform(f)
    {
    //
    }

    one would use

    if (f.elements['directions'].value == "")

    instead. Because the reference `f.elements' would be used afterwards, it
    is more efficient to assign it to a local variable and use that variable
    instead. This approach also facilitates a basic feature test:

    function valform(f)
    {
    var es;
    if (f && (es = f.elements))
    {
    if (es['directions'].value == "")
    {
    // ...
    }

    // ...
    }

    return true;
    }

    <URL:http://pointedears.de/scripts/test/whatami>

    > msg .= "Please enter the directions of the recipe.\n";


    The string concatenation operator in ECMAScript implementations is `+',
    not `.' (as in PHP). The string concatenation operation `+=' is generally
    inefficient compared to the available alternatives (even in PHP).

    However, ...

    > }
    >
    >
    > if ( document.recipeform.description.value == "" ) {
    > msg += "Please enter the description of the recipe.\n";
    > }
    >
    >
    > if ( document.recipeform.ingredients.value == "" ) {
    > msg .= "Please enter the ingredients of the recipe.\n";

    ^^
    (See above.)

    > }


    .... this approach is hardly user-friendly. A user-friendly approach would
    present the user with a list of data that are missing, embedded in the
    message, not the same sentence with only different parts again and again.

    > if(msg != '') {
    > alert(msg);
    > return false;
    > }
    > return true;
    > }
    >
    > //-->
    > </script>


    Therefore:

    <meta http-equiv="Content-Script-Type" content="text/javascript">
    ....
    <form ... onsubmit="return valform(this);">
    <script type="text/javascript">
    function valform(f)
    {
    var es;
    if (f && (es = f.elements))
    {
        var
    // or `new Array()', for JavaScript 1.1 and 1.2
    aMissing = [],

    // or `new RegExp()', for JavaScript 1.1/JScript 2.0
    rxNotEmpty = /\S/;

        if (!rxNotEmpty.test(es['directions'].value))
    {
    // or `aMissing[aMissing.length] = "..."',
    // for JavaScript 1.2/JScript 2.0
        aMissing.push("- directions of the recipe");
        }

        if (!rxNotEmpty.test(es['description'].value))
    {
            aMissing.push("- description of the recipe");
        }

        if (!rxNotEmpty.test(es['ingredients'].value))
    {
            aMissing.push("- ingredients of the recipe.");
    }

        if (aMissing.length > 0)
    {
           window.alert(
    'Please provide the following information:\n\n'
    + aMissing.join("\n"));
          return false;
        }
    }

        return true;
    }
    </script>
    ...
    </form>

    However, neither of the above is news here. Ask yourself
    ("TheBigSearchEngine") for "form validation".


    PointedEars
     
    Thomas 'PointedEars' Lahn, Mar 4, 2006
    #3
  4. Openside

    Randy Webb Guest

    Thomas 'PointedEars' Lahn said the following on 3/4/2006 4:01 PM:
    > TheBigSearchEngine wrote:
    > ^^^^^^^^^^^^^^^^^^
    > Posting with such a ridiculous "name" does not increase credibility of a
    > poster.


    It's no different than you using "PointedEars" in your name. Usenet is
    anonymous, deal with it.

    > Posting such ridiculous nonsense as below is only another proof
    > to justify this preconception.


    Agreed

    <snip>

    >> function valform () {
    >> var msg = '';
    >>
    >> if ( document.recipeform.directions.value == "" ) {

    >
    > Standards compliant referencing would be
    >
    > if (document.forms['recipeform'].elements['directions'].value == "")
    > {


    But that is nonsense and has been debated here so many times it gets
    old. Either way is "acceptable" and "compliant".

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Mar 4, 2006
    #4
  5. Randy Webb wrote:

    > Thomas 'PointedEars' Lahn said the following on 3/4/2006 4:01 PM:
    >> TheBigSearchEngine wrote:
    >> ^^^^^^^^^^^^^^^^^^
    >> Posting with such a ridiculous "name" does not increase credibility
    >> of a poster.

    >
    > It's no different than you using "PointedEars" in your name.


    I expected as much from you. One day you will probably recognize the
    difference between a nickname provided along with the real name, and a
    pseudonym.

    > Usenet is anonymous, deal with it.


    Usenet is _not_ anonymous. One may use a pseudonym, but that is a
    completely different thing.


    PointedEars
     
    Thomas 'PointedEars' Lahn, Mar 4, 2006
    #5
  6. Openside

    Randy Webb Guest

    Thomas 'PointedEars' Lahn said the following on 3/4/2006 5:48 PM:
    > Randy Webb wrote:
    >
    >> Thomas 'PointedEars' Lahn said the following on 3/4/2006 4:01 PM:
    >>> TheBigSearchEngine wrote:
    >>> ^^^^^^^^^^^^^^^^^^
    >>> Posting with such a ridiculous "name" does not increase credibility
    >>> of a poster.

    >> It's no different than you using "PointedEars" in your name.

    >
    > I expected as much from you. One day you will probably recognize the
    > difference between a nickname provided along with the real name, and a
    > pseudonym.


    I am well aware of the difference Thomas. But to be that pedantic about
    the name someone uses in Usenet is a waste of time, no matter the
    intentions. It's irrelevant.

    >> Usenet is anonymous, deal with it.

    >
    > Usenet is _not_ anonymous. One may use a pseudonym, but that is a
    > completely different thing.


    You have no way of emailing me.
    You have no way of contacting me other than through Usenet.
    You have no idea if my name is really Randy Webb or not.
    All that you know about me is what I tell you about me.

    Sure, you can make a few educated guesses based on headers but that is it.

    Call it what you want, that makes it close enough to anonymous for most
    people.
    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Mar 4, 2006
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Colin Basterfield

    Web form validation vs object validation

    Colin Basterfield, Nov 28, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    429
    Tommy
    Nov 29, 2003
  2. Augustus
    Replies:
    1
    Views:
    362
    Ken Schaefer
    Sep 10, 2003
  3. Textarea Inside of a textarea

    , Feb 4, 2006, in forum: ASP General
    Replies:
    6
    Views:
    337
    Anthony Jones
    Feb 5, 2006
  4. bnp
    Replies:
    4
    Views:
    328
  5. Replies:
    1
    Views:
    320
    Bart Van der Donck
    Jul 4, 2007
Loading...

Share This Page