Grade average calculator

Page 1 of 1

4 Replies - 1387 Views - Last Post: 21 September 2012 - 09:06 AM

#1 scootymcwootwoot  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 19-September 12

Grade average calculator

Posted 19 September 2012 - 01:02 PM

Hello,

I'm trying to do a project for class and I am completely stumped. The project is this:

You are asked to build a page that will take in three grades, average them together and then return what letter grade that average is.

Requirments-
-You must provide a user interface that allows for the entering of 3 grades and the total number of points available for each grade. These should be done using HTML <input type = "text"/>.
-In your code you must add up the total points earned for all three grades and the total points possible, and determine the percent grade using Average = (total points earned / (total points available).
-Your code should be called by a button on the page.
-Your code should make use of If/Else statements to determine the letter grade.
-There should be a reset button to reset all text fields back to empty strings.
-Your results should output the following:
*Total points earned
*Total points possible
*Percent average
*Letter grade for that average
-Your page should make use of validation to ensure all fields are entered.
BONUS
-Your code should also make use of a user defined function to return a letter grade for each of the three grades entered.
-No prompts should be used on the page, also no document.write or document.writeln
-All values should be input using textboxes

I get what I'm supposed to do but I have no clue how to actually write the code I need (I'm super new at this >.<). Here is the code I have.
 
<form name = "gradecalc">
<p>Grade 1: Earned Points <input type = "text"/> Out of:<input type = "text"/></p>
<p>Grade 2: Earned Points <input type = "text"/> Out of:<input type = "text"/></p>
<p>Grade 3: Earned Points <input type = "text"/> Out of:<input type = "text"/></p>

<input name = "submit" onclick = "showsum(); type = "button" value = "Sum"/>
<input name = "submit" onclick = "showavg(); type = "button" value = "Avg"/>
<input name = "clear" type = "reset" value = "Clear Form"/>
</form>


I have no idea how to build a function that can do the averaging. I don't think I need the Sum button but other code I have looked at used it and it worked but I'm not sure where to go from here. Also does anyone have any good websites or something to help learn javascript? I have Lynda.com for my classes but it does'nt teach me what syntax I should be using for something like this.

Is This A Good Question/Topic? 0
  • +

Replies To: Grade average calculator

#2 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 115
  • View blog
  • Posts: 748
  • Joined: 25-October 08

Re: Grade average calculator

Posted 19 September 2012 - 01:48 PM

Add an id="sum' and id="avg" to the appropriate text element.
Remove the name="submit" because it would not be needed here.


In the functions (not written yet),
1. Make new variables of the earned_sum_value and out_of_sum_value,
2. Collect the information from the input fields into variables (earned_sum_value and out_of_sum_value).
They will be string inputs so be sure to change to numbers with a *1 or a parseInt() or parseFloat() function befre you try to do math on them.
3. Then display to the elements you have created with a document.getElementById('sum').value = earned_sum_value
and document.getElementById('avg').value = earned_sum_value / out_of_sum_value
Was This Post Helpful? 0
  • +
  • -

#3 TonicX57  Icon User is offline

  • D.I.C Head

Reputation: 4
  • View blog
  • Posts: 84
  • Joined: 13-September 08

Re: Grade average calculator

Posted 19 September 2012 - 07:01 PM

Looks like you forgot to end your onclick's double-quotes. Just thought I'd point that out in case you missed it.
Was This Post Helpful? 0
  • +
  • -

#4 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 115
  • View blog
  • Posts: 748
  • Joined: 25-October 08

Re: Grade average calculator

Posted 19 September 2012 - 07:35 PM

Here is an incomplete solution.
See if you can figure out the rest and post your attempt.
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8" />
<title> Untitled </title>
<script type="text/javascript">
function showsum() {
  var g1 = document.getElementById('g1').value * 1;
  var g2 = document.getElementById('g2').value * 1;
  var g3 = document.getElementById('g3').value * 1;
  document.getElementById('entry_sum').value = 'Sum: '+(g1+g2+g3);
}
function showavg() {
  alert('Function not ready yet!');
}
</script>

</head>
<body>
 
<form name = "gradecalc">
<p>Grade 1: Earned Points <input id='g1' type = "text"/> Out of:<input type = "text"/></p>
<p>Grade 2: Earned Points <input id='g2' type = "text"/> Out of:<input type = "text"/></p>
<p>Grade 3: Earned Points <input id='g3' type = "text"/> Out of:<input type = "text"/></p>

<input id='entry_sum' onclick = "showsum()" type="button" value="Sum"/>
<input id='entry_avg' onclick = "showavg()" type="button" value="Avg"/>
<input name = "clear" type = "reset" value = "Clear Form"/>
</form>

</body>
</html>

:bananaman:
Was This Post Helpful? 0
  • +
  • -

#5 scootymcwootwoot  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 19-September 12

Re: Grade average calculator

Posted 21 September 2012 - 09:06 AM

Awesome, thanks for the help. I'll give this a shot and post back what I get.
Was This Post Helpful? 0
  • +
  • -
Page 1 of 1