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 10 of 10
  1. #1
    New to the CF scene
    Join Date
    Mar 2017
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Does not call validateForm() Why?

    //The javascript appears before the form. The call to validateForm()never
    //happens. The form works fine. Is the code in the validateForm() methd
    //correct?

    Code:
            <HTML>
            <HEAD>`enter code here`
            <Title>Travel</Title>
            </HEAD>
            <BODY bgcolor="#cc66ff">
            <FONT FACE="arial, helvetica, sans serif">
            <H1>Adventure Travel</H1>
            <H2><center>Let's Tour</center></H2>
            <BR>
            
            
            
            
            <script language="JavaScript" type="text/javascript">
            
            function myFunction() {
            
            //call to validate form check the values in the text fields aren't    
            //empty.
            	validateForm();
            
            
                var x = document.getElementById("myform");
                var text = "";
                var i;
            
            
                for (i = 0; i < x.length ;i++) {
                    text += x.elements[i].value + "<br>";
                    
               }
            document.getElementById("myform").innerHTML = text;
            
            		
            }
            
            
            
            
            function validateForm()
                  {
                   
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.
                     if( document.myform.firstname.value == "" )
            
                     {
                        alert( "Please provide your firstname!" );
                        document.myform.firstname.focus() ;
                        return false;
                     }
            
            
            	if( document.myform.lastname.value == "" )
                     {
                        alert( "Please provide your lastname!" ||
                     	document.myform.lastname.value.length >12 ));
                        document.myform.lastname.focus() ;
                        return false;
                     }
            
            	if( document.myform.streetaddress.value == "" )
                     {
                        alert( "Please provide your streetaddress!" );
                        document.myform.streetaddress.focus();
                        return false;
                     }
            
                     if( document.myform.state.value == "" )
                     {
                        alert( "Please provide your state!" );
                        document.myform.state.focus();
                        return false;
                     }
            
            
            	if( document.myform.Zip.value == "" ||
                     isNaN( document.myform.Zip.value ) ||
                     document.myform.Zip.value.length != 5 )
                     {
                        alert( "Please provide a zip in the format #####." );
                        document.myform.Zip.focus() ;
                        return false;
                     }
            
            
            
                     if( document.myform.email.value == "" )
                     {
                        alert( "Please provide your Email!" );
                        document.myform.email.focus();
                        return false;
                     }
                     
                     
                     
                     if( document.myform.userid.value == "" )
                     {
                        alert( "Please provide your userid!" );
                        document.myform.userid.focus() ;
                        return false;
                     }
            
            
                    if( document.myform.password.value == "" )
                     {
                        alert( "Please provide your password!" );
                        document.myform.password.focus() ;
                        return false;
                     }
            
                     return( true );
                  }
            
            </script>
            
            <table>
            <tr>
            <th>Register For Tour</th>
            </tr>
              <tr>
                <td>
                   <form id="myform">
                     <table>
                       <tr>
                        <tr>
                     <td>First name:<br></td> 
                     <td><input type="text" name="firstname" value=" "><br></td></tr>                                                        
                     <tr></tr>    
                     <tr>
                     <td>Last name:<br></td> 
                     <td><input type="text" name="lastname" maxlength="12"><br></td> 
                     </tr>
                     <tr></tr>
                    <tr>
                     <td>Street Address:<br></td> 
                     <td><input type="text" name="streetaddress"><br></td> 
                    </tr>
                   <tr></tr>
                    <tr>
                     <td>State:<br></td> 
                     <td><input type="text" name="state"><br></td> 
                     </tr>
                    <tr></tr>
                     <tr>
                     <td>Zip Code:<br></td> 
                     <td><input type="text" name="Zip"><br></td> 
                    </tr>
                   <tr></tr>
                   <tr>
                     <td>Email Address:<br></td> 
                     <td><input type="text" name="emailaddress"><br></td> 
                    </tr>
                   <tr></tr>
                   <tr>
                     <td><input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden">Skate In Sweden<br><br></td> 
                     <td><input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked">Skate In Estonia<br><br></td> 
                    </tr>
                   <tr></tr>
                  <tr>
                     <td>User Id:<br></td> 
                     <td><input type="text" name="userid"><br></td> 
                  </tr>
                <tr></tr>
               <tr>
                     <td><label for="password">Password</label><br></td> 
                     <td><input type="password" name="password" id="password" maxlength="6">:<br></td> 
               </tr>
            <tr></tr>
            <tr>
                      <td><button onclick="myFunction()">Submit</button><br></td> 
             </tr>
            <tr>
              </tr>
                 </table>
               </form>
             </td>
            </tr>
         </table>
         </BODY>
        </HTML>
    Last edited by vinyl-junkie; 03-20-2017 at 06:22 PM. Reason: added code tags

  2. #2
    Regular Coder
    Join Date
    Sep 2010
    Location
    U S of A
    Posts
    220
    Thanks
    4
    Thanked 41 Times in 41 Posts
    Code:
    
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
    
      <html>  
    <head>      
            <Title>Travel</Title>              
            <style type="text/css">
    label{display:block;line-height:2;width:25em}
    input{float:right;width:17em}
    fieldset{width:25em}
    h1 span{font-size:medium}
             </style>  
    </head>      
            <body bgcolor="#cc66ff">
            <H1>Adventure Travel
            <span>Let's Tour</span>
            </H1> 
            <form id="myform" action="" onsubmit="return myFunction();">
    <fieldset>
    <legend>Register For Tour</legend>
    
                     <label>First name:<input type="text" name="firstname"></label>                                                      
                     <label>Last name:<input type="text" name="lastname" maxlength="12"></label> 
                     
                     <label>Street Address:
                     <input type="text" name="streetaddress"></label> 
                    <label>State: 
                     <input type="text" name="state"></label> 
                     <label>Zip Code:
                     <input type="text" name="Zip"></label> 
                    <label>Email Address:
                     <input type="text" name="emailaddress"></label> 
    		<label>Skate In Sweden :	
                    <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden"></label> 
    		<label>Skate In Estonia:
                     <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked"></label> 
                    </fieldset>
    <fieldset>
    <legend>log in</legend>
    <label>User Id: 
                     <input type="text" name="userid"></label> 
                  <label>Password:
                     <input type="password" name="password" id="password" maxlength="6"></label> </fieldset>
              <button>Submit</button>         
               </form>         
            <script type="text/javascript">        
            function myFunction() {        
            //call to validate form check the values in the text fields aren't    
            //empty.
            	if(validateForm() == false)return false;            
                var text = "";
                var i;        
                for (i = 0; i < myform.length ;i++) {
                    text += myform.elements[i].value + "<br>";                
               }
            myform.innerHTML = text;        		
            }        
            function validateForm(){               
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.			
                     if( myform.firstname.value == "" ){
                        alert( "Please provide your firstname!" );
                        myform.firstname.focus() ;
                        return false;
                     }        
            	if( myform.lastname.value == "" ||
                     	myform.lastname.value.length >12){
                        alert( "Please provide your lastname!"  );
                        myform.lastname.focus() ;
                        return false;
                     }        
            	if( myform.streetaddress.value == "" ){
                        alert( "Please provide your streetaddress!" );
                        myform.streetaddress.focus();
                        return false;
                     }        
                     if( myform.state.value == "" ){
                        alert( "Please provide your state!" );
                        myform.state.focus();
                        return false;
                     }       
            	if( myform.Zip.value == "" ||
                     isNaN( myform.Zip.value ) ||
                     myform.Zip.value.length != 5 ){
                        alert( "Please provide a zip in the format #####." );
                        myform.Zip.focus() ;
                        return false;
                     }       
                     if( myform.email.value == "" ){
                        alert( "Please provide your Email!" );
                        myform.email.focus();
                        return false;
                     }                 
                     if( myform.userid.value == "" ){
                        alert( "Please provide your userid!" );
                        myform.userid.focus() ;
                        return false;
                     }        
                    if( myform.password.value == "" ){
                        alert( "Please provide your password!" );
                        myform.password.focus() ;
                        return false;
                     }        
                     return( true );
                  }        
            </script></body></html>
    
    Last edited by Shaka Zorba; 03-20-2017 at 08:50 PM.

  3. #3
    Regular Coder
    Join Date
    Feb 2016
    Posts
    906
    Thanks
    0
    Thanked 187 Times in 185 Posts
    IMO it would make things easier when you would use HTML5 form validation. One attribute "required" check whether an input is empty or not.

  4. #4
    New to the CF scene
    Join Date
    Mar 2017
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thank you!!!

    Thank you so much! The validate function gets called now! How do I get the values in the textfields to print on the page after validation, using this code?


    var text = "";
    var i;
    for (i = 0; i < myform.length ;i++) {
    text += myform.elements[i].value + "<br>";
    }
    myform.innerHTML = text;





    Quote Originally Posted by Shaka Zorba View Post
    Code:
    
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
    
      <html>  
    <head>      
            <Title>Travel</Title>              
            <style type="text/css">
    label{display:block;line-height:2;width:25em}
    input{float:right;width:17em}
    fieldset{width:25em}
    h1 span{font-size:medium}
             </style>  
    </head>      
            <body bgcolor="#cc66ff">
            <H1>Adventure Travel
            <span>Let's Tour</span>
            </H1> 
            <form id="myform" action="" onsubmit="return myFunction();">
    <fieldset>
    <legend>Register For Tour</legend>
    
                     <label>First name:<input type="text" name="firstname"></label>                                                      
                     <label>Last name:<input type="text" name="lastname" maxlength="12"></label> 
                     
                     <label>Street Address:
                     <input type="text" name="streetaddress"></label> 
                    <label>State: 
                     <input type="text" name="state"></label> 
                     <label>Zip Code:
                     <input type="text" name="Zip"></label> 
                    <label>Email Address:
                     <input type="text" name="emailaddress"></label> 
    		<label>Skate In Sweden :	
                    <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden"></label> 
    		<label>Skate In Estonia:
                     <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked"></label> 
                    </fieldset>
    <fieldset>
    <legend>log in</legend>
    <label>User Id: 
                     <input type="text" name="userid"></label> 
                  <label>Password:
                     <input type="password" name="password" id="password" maxlength="6"></label> </fieldset>
              <button>Submit</button>         
               </form>         
            <script type="text/javascript">        
            function myFunction() {        
            //call to validate form check the values in the text fields aren't    
            //empty.
            	if(validateForm() == false)return false;            
                var text = "";
                var i;        
                for (i = 0; i < myform.length ;i++) {
                    text += myform.elements[i].value + "<br>";                
               }
            myform.innerHTML = text;        		
            }        
            function validateForm(){               
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.			
                     if( myform.firstname.value == "" ){
                        alert( "Please provide your firstname!" );
                        myform.firstname.focus() ;
                        return false;
                     }        
            	if( myform.lastname.value == "" ||
                     	myform.lastname.value.length >12){
                        alert( "Please provide your lastname!"  );
                        myform.lastname.focus() ;
                        return false;
                     }        
            	if( myform.streetaddress.value == "" ){
                        alert( "Please provide your streetaddress!" );
                        myform.streetaddress.focus();
                        return false;
                     }        
                     if( myform.state.value == "" ){
                        alert( "Please provide your state!" );
                        myform.state.focus();
                        return false;
                     }       
            	if( myform.Zip.value == "" ||
                     isNaN( myform.Zip.value ) ||
                     myform.Zip.value.length != 5 ){
                        alert( "Please provide a zip in the format #####." );
                        myform.Zip.focus() ;
                        return false;
                     }       
                     if( myform.email.value == "" ){
                        alert( "Please provide your Email!" );
                        myform.email.focus();
                        return false;
                     }                 
                     if( myform.userid.value == "" ){
                        alert( "Please provide your userid!" );
                        myform.userid.focus() ;
                        return false;
                     }        
                    if( myform.password.value == "" ){
                        alert( "Please provide your password!" );
                        myform.password.focus() ;
                        return false;
                     }        
                     return( true );
                  }        
            </script></body></html>
    

  5. #5
    Regular Coder
    Join Date
    Sep 2010
    Location
    U S of A
    Posts
    220
    Thanks
    4
    Thanked 41 Times in 41 Posts
    Code:
    
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
    
      <html>  
    <head>      
            <Title>Travel</Title>              
            <style type="text/css">
    label{display:block;line-height:2;width:25em}
    input{float:right;width:17em}
    fieldset{width:25em}
    h1 span{font-size:medium}
             </style>  
    </head>      
            <body bgcolor="#cc66ff">
            <H1>Adventure Travel
            <span>Let's Tour</span>
            </H1> 
    <div id=dsply></div>
            <form id="myform" action="" onsubmit="return myFunction()">
    <fieldset>
    <legend>Register For Tour</legend>
    
                     <label>First name:<input type="text" name="firstname" value=shaka></label>                                                      
                     <label>Last name:<input type="text" name="lastname" maxlength="12" value=zorba></label> 
                     
                     <label>Street Address:
                     <input type="text" name="streetaddress" value="666 hells ave"></label> 
                    <label>State: 
                     <input type="text" name="state" value=TEXAS></label> 
                     <label>Zip Code:
                     <input type="text" name="Zip" value=12345></label> 
                    <label>Email Address:
                     <input type="text" name="emailaddress" value=me@home.alone></label> 
    		<label>Skate In Sweden :	
                    <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden"></label> 
    		<label>Skate In Estonia:
                     <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked"></label> 
                    </fieldset>
    <fieldset>
    <legend>log in</legend>
    <label>User Id: 
                     <input type="text" name="userid" value=afro_greko></label> 
                  <label>Password:
                     <input type="password" name="password" id="password" maxlength="6" value=russo_republican></label> </fieldset>
              <button>Submit</button>         
               </form>         
            <script type="text/javascript">  
          
            function myFunction() {         
                 if(validateForm()==false)return false;          
                 var text = "";
                 var i; 
                 for (i = 0; i < myform.elements.length ;i++) {
                       if(myform.elements[i].type=='text')text += myform.elements[i].value + "<br>"; 
                 }
                 dsply.innerHTML = text;  
    		return false;    		
            }        
            function validateForm(){               
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.			
                     if( myform.firstname.value == "" ){
                        alert( "Please provide your firstname!" );
                        myform.firstname.focus() ;
                        return false;
                     }        
            	if( myform.lastname.value == "" ||
                     	myform.lastname.value.length >12){
                        alert( "Please provide your lastname!"  );
                        myform.lastname.focus() ;
                        return false;
                     }        
            	if( myform.streetaddress.value == "" ){
                        alert( "Please provide your streetaddress!" );
                        myform.streetaddress.focus();
                        return false;
                     }        
                     if( myform.state.value == "" ){
                        alert( "Please provide your state!" );
                        myform.state.focus();
                        return false;
                     }       
            	if( myform.Zip.value == "" ||
                     isNaN( myform.Zip.value ) ||
                     myform.Zip.value.length != 5 ){
                        alert( "Please provide a zip in the format #####." );
                        myform.Zip.focus() ;
                        return false;
                     }    
       
                     if( myform.emailaddress.value == "" ){
                        alert( "Please provide your Email!" );
                        myform.emailaddress.focus();
                        return false;
                     }                
                     if( myform.userid.value == "" ){
                        alert( "Please provide your userid!" );
                        myform.userid.focus() ;
                        return false;
                     }      
                    if( myform.password.value == "" ){
                        alert( "Please provide your password!" );
                        myform.password.focus() ;
                        return false;
                     }        
                  }        
            </script></body></html>
    
    
    
    Last edited by Shaka Zorba; 03-20-2017 at 11:53 PM.

  6. #6
    New to the CF scene
    Join Date
    Mar 2017
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thank you!!!!!!!!!!!!!!!!!

    Sorry, but I don't understand why the return false after the for loop works


    Quote Originally Posted by Shaka Zorba View Post
    Code:
    
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
    
      <html>  
    <head>      
            <Title>Travel</Title>              
            <style type="text/css">
    label{display:block;line-height:2;width:25em}
    input{float:right;width:17em}
    fieldset{width:25em}
    h1 span{font-size:medium}
             </style>  
    </head>      
            <body bgcolor="#cc66ff">
            <H1>Adventure Travel
            <span>Let's Tour</span>
            </H1> 
    <div id=dsply></div>
            <form id="myform" action="" onsubmit="return myFunction()">
    <fieldset>
    <legend>Register For Tour</legend>
    
                     <label>First name:<input type="text" name="firstname" value=shaka></label>                                                      
                     <label>Last name:<input type="text" name="lastname" maxlength="12" value=zorba></label> 
                     
                     <label>Street Address:
                     <input type="text" name="streetaddress" value="666 hells ave"></label> 
                    <label>State: 
                     <input type="text" name="state" value=TEXAS></label> 
                     <label>Zip Code:
                     <input type="text" name="Zip" value=12345></label> 
                    <label>Email Address:
                     <input type="text" name="emailaddress" value=me@home.alone></label> 
    		<label>Skate In Sweden :	
                    <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden"></label> 
    		<label>Skate In Estonia:
                     <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked"></label> 
                    </fieldset>
    <fieldset>
    <legend>log in</legend>
    <label>User Id: 
                     <input type="text" name="userid" value=afro_greko></label> 
                  <label>Password:
                     <input type="password" name="password" id="password" maxlength="6" value=russo_republican></label> </fieldset>
              <button>Submit</button>         
               </form>         
            <script type="text/javascript">  
          
            function myFunction() {         
                 if(validateForm()==false)return false;          
                 var text = "";
                 var i; 
                 for (i = 0; i < myform.elements.length ;i++) {
                       if(myform.elements[i].type=='text')text += myform.elements[i].value + "<br>"; 
                 }
                 dsply.innerHTML = text;  
    		return false;    		
            }        
            function validateForm(){               
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.			
                     if( myform.firstname.value == "" ){
                        alert( "Please provide your firstname!" );
                        myform.firstname.focus() ;
                        return false;
                     }        
            	if( myform.lastname.value == "" ||
                     	myform.lastname.value.length >12){
                        alert( "Please provide your lastname!"  );
                        myform.lastname.focus() ;
                        return false;
                     }        
            	if( myform.streetaddress.value == "" ){
                        alert( "Please provide your streetaddress!" );
                        myform.streetaddress.focus();
                        return false;
                     }        
                     if( myform.state.value == "" ){
                        alert( "Please provide your state!" );
                        myform.state.focus();
                        return false;
                     }       
            	if( myform.Zip.value == "" ||
                     isNaN( myform.Zip.value ) ||
                     myform.Zip.value.length != 5 ){
                        alert( "Please provide a zip in the format #####." );
                        myform.Zip.focus() ;
                        return false;
                     }    
       
                     if( myform.emailaddress.value == "" ){
                        alert( "Please provide your Email!" );
                        myform.emailaddress.focus();
                        return false;
                     }                
                     if( myform.userid.value == "" ){
                        alert( "Please provide your userid!" );
                        myform.userid.focus() ;
                        return false;
                     }      
                    if( myform.password.value == "" ){
                        alert( "Please provide your password!" );
                        myform.password.focus() ;
                        return false;
                     }        
                  }        
            </script></body></html>
    
    
    

  7. #7
    Regular Coder
    Join Date
    Sep 2010
    Location
    U S of A
    Posts
    220
    Thanks
    4
    Thanked 41 Times in 41 Posts
    Quote Originally Posted by goofy View Post
    Sorry, but I don't understand why the return false after the for loop works
    Code:
     function myFunction() {         
                 if(validateForm()==false)return false;          
                 var text = "";
                 var i; 
                 for (i = 0; i < myform.elements.length ;i++) {
                       if(myform.elements[i].type=='text')text += myform.elements[i].value + "<br>"; 
                 }
                 dsply.innerHTML = text;  
    		//return false;    without this to prevent submission		
                    // the form would be submitted and the Page refreshed
                   // so you could not see the results of the values printed ouy
            }
    if you would like to see
    the values that were actually submitted
    to the server then the server
    should return those values
    Last edited by Shaka Zorba; 03-21-2017 at 12:39 AM.

  8. #8
    New to the CF scene
    Join Date
    Mar 2017
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hello,

    Thank you so very much!! (as you know, I am new to this so you are helping me learn)
    I have a couple of other questions.
    When I show the values of the text field, a few extra undefined appear. Why? How do I get rid of them, please?


    undefined
    firstname rwer
    lastname werwe
    streetaddress werwer
    state wrwer
    Zip 33333
    emailaddress sdfdsgsd
    tour Skate In Sweden
    tour Skate In Estonia
    undefined
    userid asdsad
    password sadasd

    Second, How do I get just the value of the tour radio button selected to appear, instead of both of them?

  9. #9
    Regular Coder
    Join Date
    Sep 2010
    Location
    U S of A
    Posts
    220
    Thanks
    4
    Thanked 41 Times in 41 Posts
    here is a different approach
    which does not have those
    problems

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
    
      <html>  
    <head>      
            <Title>Travel</Title>              
            <style type="text/css">
    label{display:block;line-height:2;width:25em}
    input{float:right;width:17em}
    fieldset{width:25em}
    h1 span{font-size:medium}
             </style>  
    </head>      
            <body bgcolor="#cc66ff">
            <H1>Adventure Travel
            <span>Let's Tour</span>
            </H1> 
    <div id=dsply></div>
            <form id="myform" action="" onsubmit="return validateForm()">
    <fieldset>
    <legend>Register For Tour</legend>
    
                     <label>First name:<input type="text" name="firstname" value=shaka></label>                                                      
                     <label>Last name:<input type="text" name="lastname" maxlength="12" value=zorba></label> 
                     
                     <label>Street Address:
                     <input type="text" name="streetaddress" value="666 hells ave"></label> 
                    <label>State: 
                     <input type="text" name="state" value=TEXAS></label> 
                     <label>Zip Code:
                     <input type="text" name="Zip" value=12345></label> 
                    <label>Email Address:
                     <input type="text" name="emailaddress" value=me@home.alone></label> 
    		<label>Skate In Sweden :	
                    <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden"></label> 
    		<label>Skate In Estonia:
                     <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked"></label> 
                    </fieldset>
    <fieldset>
    <legend>log in</legend>
    <label>User Id: 
                     <input type="text" name="userid" value=afro_greko></label> 
                  <label>Password:
                     <input type="password" name="password" id="password" maxlength="6" value=russo_republican></label> </fieldset>
              <button>Submit</button>         
               </form>         
            <script type="text/javascript">
    var result={};  
    ( function (result) {            
        var pairs = location.search.slice(1).split('&');    
        pairs.forEach(function(pair) {
            pair = pair.split('=');
            result[pair[0]] = decodeURIComponent(pair[1] || '');
        });   
    }(result));
    
    Object.keys(result).forEach(function(key,index) {
        dsply.appendChild(document.createTextNode(key+" = "+result[key]));
        dsply.appendChild(document.createElement('br'));
    });
    
           
            function validateForm(){               
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.			
                     if( myform.firstname.value == "" ){
                        alert( "Please provide your firstname!" );
                        myform.firstname.focus() ;
                        return false;
                     }        
            	if( myform.lastname.value == "" ||
                     	myform.lastname.value.length >12){
                        alert( "Please provide your lastname!"  );
                        myform.lastname.focus() ;
                        return false;
                     }        
            	if( myform.streetaddress.value == "" ){
                        alert( "Please provide your streetaddress!" );
                        myform.streetaddress.focus();
                        return false;
                     }        
                     if( myform.state.value == "" ){
                        alert( "Please provide your state!" );
                        myform.state.focus();
                        return false;
                     }       
            	if( myform.Zip.value == "" ||
                     isNaN( myform.Zip.value ) ||
                     myform.Zip.value.length != 5 ){
                        alert( "Please provide a zip in the format #####." );
                        myform.Zip.focus() ;
                        return false;
                     }     
                     if( myform.emailaddress.value == "" ){
                        alert( "Please provide your Email!" );
                        myform.emailaddress.focus();
                        return false;
                     }                
                     if( myform.userid.value == "" ){
                        alert( "Please provide your userid!" );
                        myform.userid.focus() ;
                        return false;
                     }      
                    if( myform.password.value == "" ){
                        alert( "Please provide your password!" );
                        myform.password.focus() ;
                        return false;
                     }        
                  }        
            </script></body></html>

  10. #10
    New to the CF scene
    Join Date
    Mar 2017
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    thank u This is very sophisticated for me at my level

    thank u This is very sophisticated for me at my level


    Quote Originally Posted by Shaka Zorba View Post
    here is a different approach
    which does not have those
    problems

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
    
      <html>  
    <head>      
            <Title>Travel</Title>              
            <style type="text/css">
    label{display:block;line-height:2;width:25em}
    input{float:right;width:17em}
    fieldset{width:25em}
    h1 span{font-size:medium}
             </style>  
    </head>      
            <body bgcolor="#cc66ff">
            <H1>Adventure Travel
            <span>Let's Tour</span>
            </H1> 
    <div id=dsply></div>
            <form id="myform" action="" onsubmit="return validateForm()">
    <fieldset>
    <legend>Register For Tour</legend>
    
                     <label>First name:<input type="text" name="firstname" value=shaka></label>                                                      
                     <label>Last name:<input type="text" name="lastname" maxlength="12" value=zorba></label> 
                     
                     <label>Street Address:
                     <input type="text" name="streetaddress" value="666 hells ave"></label> 
                    <label>State: 
                     <input type="text" name="state" value=TEXAS></label> 
                     <label>Zip Code:
                     <input type="text" name="Zip" value=12345></label> 
                    <label>Email Address:
                     <input type="text" name="emailaddress" value=me@home.alone></label> 
    		<label>Skate In Sweden :	
                    <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Sweden"></label> 
    		<label>Skate In Estonia:
                     <input type="radio" name="tour" onclick="check(this.value)" value="Skate In Estonia" checked="checked"></label> 
                    </fieldset>
    <fieldset>
    <legend>log in</legend>
    <label>User Id: 
                     <input type="text" name="userid" value=afro_greko></label> 
                  <label>Password:
                     <input type="password" name="password" id="password" maxlength="6" value=russo_republican></label> </fieldset>
              <button>Submit</button>         
               </form>         
            <script type="text/javascript">
    var result={};  
    ( function (result) {            
        var pairs = location.search.slice(1).split('&');    
        pairs.forEach(function(pair) {
            pair = pair.split('=');
            result[pair[0]] = decodeURIComponent(pair[1] || '');
        });   
    }(result));
    
    Object.keys(result).forEach(function(key,index) {
        dsply.appendChild(document.createTextNode(key+" = "+result[key]));
        dsply.appendChild(document.createElement('br'));
    });
    
           
            function validateForm(){               
                     //if the value is empty then tell user and bring user to empty 
                     //empty text field.			
                     if( myform.firstname.value == "" ){
                        alert( "Please provide your firstname!" );
                        myform.firstname.focus() ;
                        return false;
                     }        
            	if( myform.lastname.value == "" ||
                     	myform.lastname.value.length >12){
                        alert( "Please provide your lastname!"  );
                        myform.lastname.focus() ;
                        return false;
                     }        
            	if( myform.streetaddress.value == "" ){
                        alert( "Please provide your streetaddress!" );
                        myform.streetaddress.focus();
                        return false;
                     }        
                     if( myform.state.value == "" ){
                        alert( "Please provide your state!" );
                        myform.state.focus();
                        return false;
                     }       
            	if( myform.Zip.value == "" ||
                     isNaN( myform.Zip.value ) ||
                     myform.Zip.value.length != 5 ){
                        alert( "Please provide a zip in the format #####." );
                        myform.Zip.focus() ;
                        return false;
                     }     
                     if( myform.emailaddress.value == "" ){
                        alert( "Please provide your Email!" );
                        myform.emailaddress.focus();
                        return false;
                     }                
                     if( myform.userid.value == "" ){
                        alert( "Please provide your userid!" );
                        myform.userid.focus() ;
                        return false;
                     }      
                    if( myform.password.value == "" ){
                        alert( "Please provide your password!" );
                        myform.password.focus() ;
                        return false;
                     }        
                  }        
            </script></body></html>


 

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
  •