JavaScript for calculation

Hello
I have a JavaScript code that calculates based on your dropdown(select list) selection.What i want is that the results should be capture in my input value field and not just print it out using the div tags.Can someone help me with this?
Here is my code

JavaScript Code
// JavaScript Document

var grade1_aggregrate= new Array();
grade1_aggregrate["None"]=0;
grade1_aggregrate["A"]=1;
grade1_aggregrate["B"]=2;
grade1_aggregrate["C"]=3;
grade1_aggregrate["D"]=4;
grade1_aggregrate["E"]=5;
grade1_aggregrate["F"]=6;

function getGrade1Aggregate()
{
  var formGrade1Aggregate=0;
  //Get a reference to the form id="aggregateform"
  var theForm = document.forms["aggregateform"];
  //Get a reference to the select id="grade1"
   var selectedGrade1 = theForm.elements["grade1"];
  //set formGrade1Aggregate Price equal to value user chose
  //For example grade1_aggregrate["None".value] would be equal to 0
  formGrade1Aggregate = grade1_aggregrate[selectedGrade1.value];
  //finally we return cakeFillingPrice
  return formGrade1Aggregate;
}

function calculateTotal()
{
var totalAggregate = getGrade1Aggregate();
   //var totalAggregate = getGrade1Aggregate();
 var divobj = document.getElementById('totalPrice');
 divobj.style.display='block';
   divobj.innerHTML ="Total Price For Cake $"+totalAggregate;
 }
 
 
function hideTotal()
{
  var divobj = document.getElementById('totalPrice');
  divobj.style.display='none';
}

HTML CODE

<select name="grade1" id="grade1" onchange="calculateTotal()">
     <option value="None"></option>
     <option value="A">A</option>
     <option value="B">B</option>
     <option value="C">C</option>
     <option value="D">D</option>
     <option value="E">E</option>
     <option value="F">F</option>
     </select>
<td width="243" class="td">Overall Aggregate </td>
    <input name="aggregrate" type="text"  size="10" value="" id="aggregrate" /></td>
    <div id="totalPrice"></div>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Untitled</title>
<script type="text/javascript">
// I have no idea why you need this but this is how you'd do it
// It still gives you 0...6 for their index
// grade1_aggregrate = ["None","A","B","C","D","E","F"];
//This is what I think you meant . . .
prices = {
'None':'0.00',
'A':'6.50',
'B':'8:25',
'C':'9.32',
'D':'9.79',
'E':'10.45',
'F':'11.57'
}
//
// Attact the action to the select, say no to inline JS
window.onload=function() {
document.getElementById('grade1').onchange=function() { calculateTotal(); };
};
//
function getGrade1Aggregate(){
var formGrade1Aggregate=0;
var sel = document.getElementById('grade1');
formGrade1Aggregate = sel.options[sel.selectedIndex].value;
return formGrade1Aggregate;
}
//
function calculateTotal() {
var totalAggregate = getGrade1Aggregate();
var fld = document.getElementById('MyTotal');
var divobj = document.getElementById('totalPrice');
if (fld) { fld.value = prices[totalAggregate]; }
else if (divobj) {
divobj.style.display='block';
divobj.innerHTML ="Total Price For Cake $"+prices[totalAggregate];
}
}
</script>
</head>
<body>
<p><select name="grade1" id="grade1">
<option value="None">Select</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
</select>
<label for="aggregate">Overall Aggregate</label>
<input name="aggregrate" type="text" size="10" value="" id="aggregrate"></p>
<p><label for="MyTotal">Total Price For Cake $</label>
<input type="text" name="MyTotal" id="MyTotal" value=""></p>
<div id="totalPrice"></div>
</body>
</html>

JavaScript for calculation

calculation,select list

JuicyScript

JuicyScript

rocknbil

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week