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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 19
  1. #1
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts

    multi or single option.

    I have a referral form with 4 input options.
    and a corresponding JavaScript that checks the email address' are valid.

    What if the user only wants to refer one friend...
    How can I check to make sure one valid address has been entered?
    and then validate only that input.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,466
    Thanks
    3
    Thanked 495 Times in 482 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    function zxctElsByClass(zxccls,zxcp,zxctag) {
     zxcp=zxcp||document;
     zxcp=typeof(zxcp)=='object'?zxcp:document.getElementById(zxcp);
     zxctag=zxctag||'*';
     for (var zxcels=zxcp.getElementsByTagName(zxctag),zxcreg=new RegExp('\\b'+zxccls+'\\b'),zxcary=[],zxc0=0;zxc0<zxcels.length;zxc0++){
      if (zxcreg.test(zxcels[zxc0].className)) zxcary.push(zxcels[zxc0]);
     }
     return zxcary;
    }
    
    function Validate(frm){
     var emails=zxctElsByClass('Email',frm,'INPUT');
     var mess=[]
     for (var ary=[],zxc0=0;zxc0<emails.length;zxc0++){
      if (emails[zxc0].value.replace(/\s/g,'')!=''){
       ary.push([emails[zxc0],zxc0]);
      }
     }
     if (ary.length==0){
      mess.push('One Email must be complete');
     }
     else {
      for (var zxc1=0;zxc1<ary.length;zxc1++){
      if (!validateEmail(ary[zxc1][0].value)) mess.push('Invalid Email '+ary[zxc1][1]);
    
      }
     }
     if (mess.length>0){
      alert(mess.join('\n'));
      return false;
     }
     return true;
    }
    
    function validateEmail( strValue) {
    /************************************************
    DESCRIPTION: Validates that a string contains a
      valid email pattern.
    
     PARAMETERS:
       strValue - String to be tested for validity
    
    RETURNS:
       True if valid, otherwise false.
    
    REMARKS: Accounts for email with country appended
      does not validate that email contains valid URL
      type (.com, .gov, etc.) and optionally,
      a valid country suffix.  Since email has many
      forms this expression only tests for near valid
      address.  Some additional validation may be
      required.
    *************************************************/
    var objRegExp  = /^[a-z0-9]([a-z0-9_\-\.]*)@([a-z0-9_\-\.]*)(\.[a-z]{2,3}(\.[a-z]{2}){0,2})$/i;
      //check for valid email
      return objRegExp.test(strValue);
    }
    
    /*]]>*/
    </script></head>
    
    <body>
    
     as you do not specify the form naming convention I have used the class name<br />
     <form onsubmit="return Validate(this);" action="http://www.codingforums.com" >
    <input class="Email" name="" /><br />
    <input class="Email" name="" /><br />
    <input class="Email" name="" /><br />
    <input type="submit" name="" value="Submit" />
    </form>
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Oh I have the class and name in use already. Unfortunately they are different names, can I use the ID instead?


    Here is the code
    Code:
    <form action="http://www.website.com.au/processform.php" method="post" name="friendform">        
                      
        <div><input class="refer-name" type="text" size="30" maxlength="50" name="rname" value="your name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-email" type="text" size="30" maxlength="50" name="remail" value="your email address"  onfocus="clearText(this);" onblur="revert(this);"></div>
        
        <div id="refer-1"></div>
        <div><input class="refer-friend1-name" type="text" size="30" maxlength="50" name="freind1_name" value="friend's name"  onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-friend1-email" type="text" size="30" maxlength="50" name="freind1_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div id="refer-2"></div> 
        <div><input class="refer-friend2-name" type="text" size="30" maxlength="50" name="freind2_name" value="friend's name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-friend2-email" type="text" size="30" maxlength="50" name="freind2_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
        
        <div id="refer-3"></div> 
        <div><input class="refer-friend3-name" type="text" size="30" maxlength="50" name="freind3_name" value="friend's name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-friend3-email" type="text" size="30" maxlength="50" name="freind3_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,466
    Thanks
    3
    Thanked 495 Times in 482 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    function zxctElsByClass(zxccls,zxcp,zxctag) {
     zxcp=zxcp||document;
     zxcp=typeof(zxcp)=='object'?zxcp:document.getElementById(zxcp);
     zxctag=zxctag||'*';
     for (var zxcels=zxcp.getElementsByTagName(zxctag),zxcreg=new RegExp('\\b'+zxccls+'\\b'),zxcary=[],zxc0=0;zxc0<zxcels.length;zxc0++){
      if (zxcreg.test(zxcels[zxc0].className)) zxcary.push(zxcels[zxc0]);
     }
     return zxcary;
    }
    
    function Validate(frm){
     var emails=zxctElsByClass('zxcEmail',frm,'INPUT');
     var mess=[]
     for (var ary=[],zxc0=0;zxc0<emails.length;zxc0++){
      if (emails[zxc0].value.replace('friend\'s e-mail','').replace(/\s/g,'')){
       ary.push(emails[zxc0]);
      }
     }
     if (ary.length==0){
      mess.push('One friends Email must be complete');
     }
     else {
      for (var zxc1=0;zxc1<ary.length;zxc1++){
      if (!validateEmail(ary[zxc1].value)) mess.push('Invalid Email - '+(ary[zxc1].title||ary[zxc1].name));
    
      }
     }
     if (mess.length>0){
      alert(mess.join('\n'));
      return false;
     }
     return true;
    }
    
    function validateEmail( strValue) {
    /************************************************
    DESCRIPTION: Validates that a string contains a
      valid email pattern.
    
     PARAMETERS:
       strValue - String to be tested for validity
    
    RETURNS:
       True if valid, otherwise false.
    
    REMARKS: Accounts for email with country appended
      does not validate that email contains valid URL
      type (.com, .gov, etc.) and optionally,
      a valid country suffix.  Since email has many
      forms this expression only tests for near valid
      address.  Some additional validation may be
      required.
    *************************************************/
    var objRegExp  = /^[a-z0-9]([a-z0-9_\-\.]*)@([a-z0-9_\-\.]*)(\.[a-z]{2,3}(\.[a-z]{2}){0,2})$/i;
      //check for valid email
      return objRegExp.test(strValue);
    }
    
    function clearText(){}
    function revert(){}
    /*]]>*/
    </script></head>
    
    <body>
    <form  onsubmit="return Validate(this);" action="http://www.website.com.au/processform.php" method="post" name="friendform">
    
        <div><input class="refer-name" type="text" size="30" maxlength="50" name="rname" value="your name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-email" type="text" size="30" maxlength="50" name="remail" value="your email address"  onfocus="clearText(this);" onblur="revert(this);"></div>
    
        <div id="refer-1"></div>
        <div><input class="refer-friend1-name" type="text" size="30" maxlength="50" name="freind1_name" value="friend's name"  onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input title="friend 1"  class="refer-friend1-email zxcEmail" type="text" size="30" maxlength="50" name="freind1_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div id="refer-2"></div>
        <div><input class="refer-friend2-name" type="text" size="30" maxlength="50" name="freind2_name" value="friend's name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input title="friend 2" class="refer-friend2-email zxcEmail" type="text" size="30" maxlength="50" name="freind2_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
    
        <div id="refer-3"></div>
        <div><input class="refer-friend3-name" type="text" size="30" maxlength="50" name="freind3_name" value="friend's name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input title="friend 3" class="refer-friend3-email zxcEmail" type="text" size="30" maxlength="50" name="freind3_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
    <input type="submit" name="" value="Submit" />
    </form>
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • Users who have thanked vwphillips for this post:

    Bambam007 (10-07-2008)

  • #5
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Thanks for updating it.

    it's showing the alert on every submit request.
    I have one filled in and the rest are at their default value.
    the same goes if all are filled in

  • #6
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by Bambam007 View Post
    I have a referral form with 4 input options.
    and a corresponding JavaScript that checks the email address' are valid.

    What if the user only wants to refer one friend...
    How can I check to make sure one valid address has been entered?
    and then validate only that input.
    This uses just the existing naming convention:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    
    <script type="text/javascript" language="javascript">
    
    function validate(theForm)
    {
     var retVal=true, nm;
       
     for( var i=1; theForm['friend'+i+'_name']; i++)
      if( (nm=theForm['friend'+i+'_name']).value.match(/\S/) 
          && nm.value !== nm.defaultValue 
          && !theForm['friend'+i+'_email'].value.match(/.+@.+/) )  
       {
        alert('Please enter an email address for your friend "'+nm.value+'"')
        retVal=false;
       }
      
     return retVal;  
    }
    
    
    function clearText(elem){if(elem.value==elem.defaultValue)elem.value='';}
    function revert(elem){if(elem.value=='')elem.value=elem.defaultValue;}
    
    </script>
    
    </head>
    
    <body>
    <form action="http://www.website.com.au/processform.php" method="post" name="friendform" onsubmit='return validate(this)'>        
                      
        <div><input class="refer-name" type="text" size="30" maxlength="50" name="rname" value="your name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-email" type="text" size="30" maxlength="50" name="remail" value="your email address"  onfocus="clearText(this);" onblur="revert(this);"></div>
        
        <div id="refer-1"></div>
        <div><input class="refer-friend1-name" type="text" size="30" maxlength="50" name="friend1_name" value="friend's name"  onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-friend1-email" type="text" size="30" maxlength="50" name="friend1_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div id="refer-2"></div> 
        <div><input class="refer-friend2-name" type="text" size="30" maxlength="50" name="friend2_name" value="friend's name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-friend2-email" type="text" size="30" maxlength="50" name="friend2_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
        
        <div id="refer-3"></div> 
        <div><input class="refer-friend3-name" type="text" size="30" maxlength="50" name="friend3_name" value="friend's name" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input class="refer-friend3-email" type="text" size="30" maxlength="50" name="friend3_email" value="friend's e-mail" onfocus="clearText(this);" onblur="revert(this);"></div>
        <div><input type='submit'></div></body>
    </html>

  • #7
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Thanks Arty Effem,

    one problem, it doesn't actually work.
    I am not sure what's missing but the code is not being accessed, do I need to change something?

  • #8
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by Bambam007 View Post
    Thanks Arty Effem,

    one problem, it doesn't actually work.
    I am not sure what's missing but the code is not being accessed, do I need to change something?
    The full example I gave works for the friend email addresses if the default text is changed.
    There's no checking of the user's address since you may want to be more stringent with it and use different wording. I did change the spelling of the friend field names.

  • #9
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Sorry to be a noob as they say. The code looks as though it should work, it's just baffling me.

    What name did you change - this part is still the same in your code:
    name="friend1_email"

  • #10
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Sigh, I have two great pieces of code from two great people- one validates all the time (even when it's correct) and one never validates. I know it's me =[

  • #11
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by Bambam007 View Post
    Sorry to be a noob as they say. The code looks as though it should work, it's just baffling me.

    What name did you change - this part is still the same in your code:
    name="friend1_email"
    The original spelling was name="freind1_name", which didn't quite look right.

  • Users who have thanked Arty Effem for this post:

    Bambam007 (10-16-2008)

  • #12
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Ohhhhhh hehe.
    nope still not validating, just submits the form.

  • #13
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Oh I just got the code supplied by vwphillips to work in my set up. Thank you.

    I know its a bit late but how would I implement the following, to check the users email is also filled in and valid?

  • #14
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    WOOOOOOOOOOOOOOOOOOOO

    I worked it out, you both taught me something - thanks again.

  • #15
    New Coder
    Join Date
    Oct 2008
    Posts
    48
    Thanks
    10
    Thanked 0 Times in 0 Posts
    One more thing to add to it...

    After it makes sure one email is filled in, can it check that the default value is changed for the corresponding name field:
    So if friend1_email is valid then is friend1_name valid also?


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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