www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 17

Thread: Logical JavaScript and Form Help?

Hybrid View

  1. #1
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Exclamation Logical JavaScript and Form Help?

    I'm starting to write my GPA Calculator program over again this time using forms. http://userpages.umbc.edu/~ofek1/gpacalc.html is the old one and works fine. http://userpages.umbc.edu/~ofek1/gpa.html is what I'm working on. Can someone tell me why I don't get the error alerts when I enter incorrect data in the forms? The functions worked in the beginning here: http://userpages.umbc.edu/~ofek1/gpacalc…

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    	
    
    		<meta http-equiv="expires" content="Sat, 13 Sept 2008 12:00:00 GMT">
    		<meta http-equiv="cache-control" content="no-cache">
    	
    		<title>GPA Calculator</title>
    		
    		<script type="text/javascript">
    		
    			/***********************************************************************
    			** ValidateCredits - 
    			** Input - 
    			** Output - 
    			***********************************************************************/
    			
    			function ValidateCredits(validNumber)
    			{
    			
    				validNumber = parseInt (validNumber);
    			
    				if (validNumber <= 0 || validNumber >= 5 || isNaN(validNumber))
    				{
    				alert("Enter a positive integer from 1 to 4");
    				return false;
    				}
    				
    				else 
    				{
    				return true;
    				}
    			
    			}
    			
    			/***********************************************************************
    			** ValidatePoints - 
    			** Input - 
    			** Output - 
    			***********************************************************************/
    			
    			function ValidatePoints(validNumber)
    			{
    			
    				validNumber = parseInt (validNumber);
    			
    				if (validNumber != 4 && validNumber != 3 && validNumber != 2 && validNumber != 1 && validNumber != 0)
    				{
    				alert("Enter a positive integer from 0 to 4");
    				return false;
    				}
    				
    				else 
    				{
    				return true;
    				}
    			
    			}
    		
    		</script>
    			
    	</head><body>
    		
    		<script type="text/javascript">
    		
    			var semester = prompt("Enter the semester: ");
    			var numCourses = 0;
    			
    			while (numCourses <= 0 || isNaN(numCourses))
    			{
    			
    				numCourses = prompt("How many courses are you taking in the " + semester + " semester?");
    				
    			}
    			
    			numCourses = parseInt(numCourses);
    			
    			while (numCourses > 0)
    			{
    			
    				document.write('Number of credits: <input type="text" name="credits" onchange="return ValidateCredits(this.value)"><br> Grade points earned: <input type="text" name="points" onchange="return ValidatePoints(this.value)"> <br>');
    			
    				numCourses = numCourses - 1;
    			
    			}
    		
    
            </script>
    		
    	</body></html>
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Question

    Thank you so much! Also, is there a way to change the name or id of each form in the while loop so individual form values can be accessed when doing the calculations?

  4. #4
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    By passing the object , not it's value
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    	
    
    		<meta http-equiv="expires" content="Sat, 13 Sept 2008 12:00:00 GMT">
    		<meta http-equiv="cache-control" content="no-cache">
    	
    		<title>GPA Calculator</title>
    		
    		<script type="text/javascript">
    		
    			/***********************************************************************
    			** ValidateCredits - 
    			** Input - 
    			** Output - 
    			***********************************************************************/
    			
    			function ValidateCredits(obj)
    			{
    			
    				validNumber = parseInt (obj.value);
    			
    				if (validNumber <= 0 || validNumber >= 5 || isNaN(validNumber))
    				{
    				alert("Enter a positive integer from 1 to 4");
    				obj.value = "";
    				obj.focus();
    				return false;
    				}
    				
    				else 
    				{
    				return true;
    				}
    			
    			}
    			
    			/***********************************************************************
    			** ValidatePoints - 
    			** Input - 
    			** Output - 
    			***********************************************************************/
    			
    			function ValidatePoints(obj)
    			{
    			
    				validNumber = parseInt (obj.value);
    			
    				if (validNumber != 4 && validNumber != 3 && validNumber != 2 && validNumber != 1 && validNumber != 0)
    				{
    				alert("Enter a positive integer from 0 to 4");
    				obj.value = "";
    				obj.focus();
                    return false;
    				}
    				
    				else 
    				{
    				return true;
    				}
    			
    			}
    		
    		</script>
    			
    	</head><body>
    		
    		<script type="text/javascript">
    		
    			var semester = prompt("Enter the semester: ");
    			var numCourses = 0;
    			
    			while (numCourses <= 0 || isNaN(numCourses))
    			{
    			
    				numCourses = prompt("How many courses are you taking in the " + semester + " semester?");
    				
    			}
    			
    			numCourses = parseInt(numCourses);
    			
    			while (numCourses > 0)
    			{
    			
    				document.write('Number of credits: <input type="text" name="credits" onchange="return ValidateCredits(this)"><br> Grade points earned: <input type="text" name="points" onchange="return ValidatePoints(this)"> <br>');
    			
    				numCourses = numCourses - 1;
    			
    			}
    		
    
            </script>
    		
    	</body></html>
    At least 98% of internet users' DNA is identical to that of chimpanzees

  5. #5
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Smile

    Could I also do it like this http://userpages.umbc.edu/~ofek1/gpa.html using counters formCredits and formPoints?

  6. #6
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    You can do, but if you want to say get total credits, it's easier if the name is the same for all credit fields.
    At least 98% of internet users' DNA is identical to that of chimpanzees

  7. #7
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Red face

    I would do it your way it's just that in order to get totalPoints you take the credits a course is worth multiplied by the points you earned for it and THAT number is added to totalPoints http://userpages.umbc.edu/~ofek1/gpacalc.html:
    Code:
    totalPoints = totalPoints + (validNumber * numPoints);
    Then the final GPA can be calculated:
    Code:
    finalGPA = totalPoints / totalCredits;
    I suppose I'm so confused because I've never had to use objects like document.getElementById to retrieve data, which is what I'll have to do to access the forms. It's also difficult because it's not a fixed number of forms, the user can enter however many courses they're taking???

    Btw Fang, you've been more helpful than dozens of websites and Yahoo! answers.

  8. #8
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Question

    I'm still confused

  9. #9
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    The number of courses is not important; they are just simple collections (arrays) of data.
    This would be the basic solution:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title></title>
    
    <script type="text/javascript">
    function totalizer() {
    var validNumber = document.getElementsByName('credits');
    var numPoints = document.getElementsByName('points');
    var totalPoints = 0;
    for(var i=0; len=validNumber.length, i<len; i++) {
        if(!ValidateCredits(validNumber[i]) || !ValidatePoints(numPoints[i])) {
            return;
            }
        totalPoints = totalPoints + (validNumber[i] * numPoints[i]);
        }
    alert(totalPoints);
    }
    </script>
    
    <style type="text/css">
    * {margin:0;padding:0;}
    </style>
    
    </head>
    <body>
    Number of credits: <input type="text" name="credits" onchange="return ValidateCredits(this)"><br> Grade points earned: <input type="text" name="points" onchange="return ValidatePoints(this)">
    Number of credits: <input type="text" name="credits" onchange="return ValidateCredits(this)"><br> Grade points earned: <input type="text" name="points" onchange="return ValidatePoints(this)">
    <button type="button" onclick="totalizer()">totalizer</button>
    </body>
    </html>
    At least 98% of internet users' DNA is identical to that of chimpanzees

  10. #10
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Question

    I'm trying to view the alert in your function that says the totalPoints when I submit the form but the error message from ValidateCredits appears instead and then it reloads the page? http://userpages.umbc.edu/~ofek1/gpa.html

  11. #11
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Code:
    document.write('<form onsubmit="TotalPoints(); return false;">');
    At least 98% of internet users' DNA is identical to that of chimpanzees

  12. #12
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Question

    The page doesn't get reloaded now, which is good, but the error message from ValidateCredits still appears? http://userpages.umbc.edu/~ofek1/gpa.html Once again Fang, I really appreciate your help!

  13. #13
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Oops should be obj.value:
    Code:
    			function TotalPoints() 			
    			{
    			
    				var validNumber = document.getElementsByName('credits');
    				var numPoints = document.getElementsByName('points');
    				var totalPoints = 0;
    				
    				for (var i=0; len=validNumber.length, i<len; i++) 
    				{
    					if (!ValidateCredits(validNumber[i].value) || !ValidatePoints(numPoints[i].value)) 
    					{				
    						return;
    					}
    					
    					totalPoints = totalPoints + (validNumber[i].value * numPoints[i].value);
    					
    				}
    				
    				alert(totalPoints);
    			
    			}
    At least 98% of internet users' DNA is identical to that of chimpanzees

  14. #14
    Join Date
    Aug 2010
    Location
    Baltimore, Maryland, United States
    Posts
    138

    Question

    Almost done, thank you! I also wrote the functions TotalCredits, CalculateGPA, and GenerateGradeReport. http://userpages.umbc.edu/~ofek1/gpa.html Though now when I call the function GenerateGradeReport, it correctly error checks but does not stop the submit if incorrect data is entered??? Btw, the final product will be http://userpages.umbc.edu/~ofek1/gc.html. Is there a way to have GenerateGradeReport write in the second frame, or will I need to learn ASP?

  15. #15
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    The use of document.write in GenerateGradeReport is writing a new document. It would be better to write elements to the document using DOM methods.

    Easy enough to write to a frame, but why use a frame?
    At least 98% of internet users' DNA is identical to that of chimpanzees

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