www.webdeveloper.com
Results 1 to 7 of 7

Thread: Multiple functions calling

  1. #1
    Join Date
    Mar 2009
    Posts
    4

    Multiple functions calling

    I am fairly new to Javascript/XHTML but have been doing pretty well with my learning. I have worked on this small program in the past and I ran across it again thinking that I now had the tools to make it work, but it's still not
    When I click the Submit button I only get the name format checked. Nothing else checks and I can't figure out why. Any help would be greatly appreciated.

    My XHTML body:
    HTML Code:
    <body>
    <form action="javascript2.html" method="post" onsubmit="return chkForm()">
    <h3>Your Information</h3>
    <p>
    	<label>
    	<input type="text" id= "name" />
    	Name (Last Name, First Name, Middle Initial)
    	</label>
    	<br /><br />
    	
    	
    	<label>
    	<input type="text" id="age" />
    	Age
    	</label>
    	<br /><br />
    	
    	<label>
    	<input type="text" id="weight" />
    	Weight
    	</label>
    	<br /><br />
    	
    	<input type="reset" value="Reset" />
    	<input type="submit" value="Submit Information" />
    </p>
    </form>
    </body>
    My JavaScript:
    Code:
    function chkForm()
    {
    	var name=document.getElementById("name").value;
    	var weight=document.getElementById("weight").value;
    	var age=document.getElementById("age").value;
    	var pos=name.search(/^[A-Z][a-z]+, ?[A-Z][a-z]+, ?[A-Z]\.?$/);
    	
    //Checking that all fields are entered 	
    	if ((name="") || (weight="") || (age=""))
    	{
    		alert("Please enter all required fields.")
    		return false;
    	}
    //Checking that the name was entered correctly	
    	if (pos != 0)
    	{
    		alert('The name you entered ' + name + 
    			' is not in the correct form. \n' +
    			'The correct form is: ' + 
    			'Last Name, Fist Name, Middle Initial \n' +
    			'Please correct your name.');
    		return false;
    	}
    	
    //Checking the age for correct format
    	if (age>17)
    	{
    		alert("You must be at least 17");
    		return false;
    	}
    
    
    //Checking the weight for correct format
    	if (!(80<weight<300))
    	{
    		alert('The weight you entered ' + weght + 
    		' is not in the correct form.  \n' +
    		'Your weight must be between 80 and 300 \n' +
    		'Please go back and correct your weight');
    		return false;
    	}
    }

  2. #2
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Give your form's elements some names. Submitting pairs of id/value instead of name/value (in case of forms' controls) is a tricky job for most of the browsers/CGI in the absence of the name attributes. We all know that id is to be used instead of name in modern javascript, but that rule is not to be applied in case of form's controls. They need a name attribute to be submitted. Think about the radio groups...
    Last edited by Kor; 03-31-2009 at 03:36 PM.

  3. #3
    Join Date
    May 2006
    Location
    Odenton, MD
    Posts
    1,449
    those are the faulty lines, try to figure out why. if you can't, we can help you:
    Code:
    if ((name="") || (weight="") || (age=""))
    
    if (age>17)
    
    if (!(80<weight<300))
    my mom is javascript, dad is javascripter, granpa is javascriptor, and my little sister is javasRidiculous.
    my nature language is javascript, then come spanish and english -- me

  4. #4
    Join Date
    Mar 2009
    Posts
    4
    I really don't see it. I have changed my variable names to represent the values stored in the XHTML form, and this didn't change anything. I had these represented like this before and had changed them when I was trying to troubleshoot this, but I just can't figure it out. The values should be stored and I am calling them as

    if (this >10)
    {
    do this
    }

    but nothing happens. Can you please help further. Thanks in advance one again. My new code is as follows.

    HTML Code:
    <body>
    <form action="javascript2.html" method="post" onsubmit="return chkForm()">
    <h3>Your Information</h3>
    <p>
    	<label>
    	<input type="text" id= "name" />
    	Name (Last Name, First Name, Middle Initial)
    	</label>
    	<br /><br />
    	
    	
    	<label>
    	<input type="text" id="age" />
    	Age
    	</label>
    	<br /><br />
    	
    	<label>
    	<input type="text" id="weight" />
    	Weight
    	</label>
    	<br /><br />
    	
    	<input type="reset" value="Reset" />
    	<input type="submit" value="Submit Information" />
    </p>
    </form>
    </body>
    Code:
    function chkForm()
    {
    	var thisName=document.getElementById("name").value;
    	var thisWeight=document.getElementById("weight").value;
    	var thisAge=document.getElementById("age").value;
    	var pos=thisName.search(/^[A-Z][a-z]+, ?[A-Z][a-z]+, ?[A-Z]\.?$/);
    	
    //Checking that all fields are entered 	
    	if ((thisName="") || (thisWeight="") || (thisAge=""))
    	{
    		alert("Please enter all required fields.")
    		return false;
    	}
    //Checking that the name was entered correctly	
    	if (pos != 0)
    	{
    		alert('The name you entered ' + thisName + 
    			' is not in the correct form. \n' +
    			'The correct form is: ' + 
    			'Last Name, Fist Name, Middle Initial \n' +
    			'Please correct your name.');
    		return false;
    	}
    	
    //Checking the age for correct format
    	if (thisAge>17)
    	{
    		alert("You must be at least 17");
    		return false;
    	}
    
    
    //Checking the weight for correct format
    	if (!(80<thisWeight<300))
    	{
    		alert('The weight you entered ' + thisWeight + 
    		' is not in the correct form.  \n' +
    		'Your weight must be between 80 and 300 \n' +
    		'Please go back and correct your weight');
    		return false;
    	}
    }

  5. #5
    Join Date
    May 2006
    Location
    Odenton, MD
    Posts
    1,449
    the variable name isn't the problem. let go back to your original code, specifically to the lines i told the problem is.
    Code:
    if ((name="") || (weight="") || (age=""))
    here you meant to compare each variable if are empty string, not to assign an empty string. so one = is to assign (assignment operator) while two == is to compare (equality operator).

    Code:
    if (age>17)
    here the logic is wrong. you meant to return false and display the alert only when the typed age is less than 17.

    Code:
    if (!(80<weight<300))
    this one can be very tricky. the comparison operators always return a boolean, either true or false. the problem here is that at some point, javascript compare a boolean with a number. what follow is an example of how javascript interpret the operation. assuming that weight = 120.
    Code:
    if (!(80<weight<300))
    // the first operator take each operand and compare them returning a boolean of true;
    
    if (!(true<300))
    // then the returned boolean is used in the second operation. because boolean and integer
    // are different type value, javascript have coercion mechanism. a true value is
    // converted to integer 1, and a false is converted to integer 0;
    
    if (!(1<300))
    // now it result as !true which in turn result as false.
    so, the block is never executed. the reason this exactly happen is because you always will have to comparison true < 300 or false < 300 which is the same as 1 < 300 or 0 < 300. what you need is to separate both operation so that coercion don't take place:
    Code:
    if ((weight < 80) || (weight > 300))
    // notice i don't used the complement operator (!);
    it means, execute the block only if weight is less than 80 or weight greater than 300.
    Last edited by ZeroKilled; 03-31-2009 at 10:54 PM.
    my mom is javascript, dad is javascripter, granpa is javascriptor, and my little sister is javasRidiculous.
    my nature language is javascript, then come spanish and english -- me

  6. #6
    Join Date
    Mar 2009
    Posts
    4
    Amazing, ZeroKilled. Thank you so much for the help with this. After running through a js validator I couldn't find the errors, and low and behold I didn't think my logic was wrong, but you show me that it is. I was really stuck on the

    Code:
    //Checking that all fields are entered 	
    	if ((thisName == "") || (thisWeight == "") || (thisAge == ""))
    	{
    		alert('Please enter all required fields.');
    		return false;
    	}
    because it was the first statement and wasn't working properly. I now see the difference between comparing or assigning. Everything is working perfectly now I thank you for your time.

  7. #7
    Join Date
    May 2006
    Location
    Odenton, MD
    Posts
    1,449
    always happy to help!!
    my mom is javascript, dad is javascripter, granpa is javascriptor, and my little sister is javasRidiculous.
    my nature language is javascript, then come spanish and english -- me

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles