...

View Full Version : How to add to an existing element within an array



klondike
07-02-2011, 07:33 PM
Im trying to add to each element within an array. In this program I have an existing array which is called aScores. I have copied its contents into another array called aScores using slice. Now Im trying to add the value of variable called classCurve to each element of aCurve using a for loop (see under the Curve Scores functrion section). However, it does not seem to add the two together(e.g 78 + 5).

Any advice would be very helpful.

Here is my code:



<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>


<script>
<!--
var aScores = new Array(); //array to hold test scores
var aCurve = new Array(); //array to hold test scores with curve
var classAveRounded = 0; //average of test scores
var howLong = 0; //length of array -- contingent on how many test scores entered



//------------------- LoadScores function -----------------------------
function LoadScores() {
var classAve = 0;
var rawScores = document.getElementById("Scores").value;

aScores=rawScores.split(","); //seperate the test scores by comma
//alert(aScores[1]); //test to see if they are separated

var howLong = aScores.length; //variable to measure how long the array is

for(i=0; i<howLong; i++){
aScores[i] = parseInt(aScores[i]); //convert strings to numbers
}

//alert(aScores[0] + aScores[1]); //test to make sure array contains numbers


aScores.sort(sortNumber); //sort the scores from highest to lowest

//insert scores from the array into the score text boxes.
for (i=0; i<howLong; i++) {
document.getElementById("Score" + i).value = aScores[i];
}

//total the test scores
var total=0;

for(i=0; i<howLong; i++) {
total += aScores[i];
}

//average the total and insert it into the Average textbox(Math.ceil rounds up aveCalc).
classAve = total/howLong;
classAveRounded = Math.ceil(classAve);
document.getElementById("Average").value = classAveRounded;
}


//------------------- sortNumber function ------------------------------
function sortNumber(a,b){
return b-a;
}


//------------------- CurveScores function -----------------------------

function CurveScores() {

var classCurve = 0;

alert(classAveRounded);
if(classAveRounded<75) {
classCurve=(75-classAveRounded);
}else{
classCurve=0;
}

alert(classCurve);



aCurve=aScores.slice();
//alert(aCurve[7]); //test to see if aCurve holds test scores

for(i=0; i<howLong; i++) {
aCurve[i]=aCurve[i] + classCurve;

}





// alert(aCurve[0]);



//total the curved scores
var totalCurvedScores=0;

for(i=0; i<howLong; i++) {
totalCurvedScores += aCurve[i];
}

//average the total and insert it into the CurvedAverage textbox(Math.ceil rounds up aveCalc).
curvedAve = totalCurvedScores/howLong;
curvedAveRounded = Math.ceil(curvedAve);
document.getElementById("CurvedAverage").value = curvedAveRounded;


}


-->
</script>




</head>

<body>

<table border="1">
<tr style="background-color:#F0F0F0; font-size:10pt; font-weight:bold;
text-align:center; vertical-align:bottom">
<td>Score</td>
<td>Curved</td>
<td>Grade</td>
</tr>

<tr>
<td>
<input id="Score0" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score1" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score2" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score3" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score4" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score5" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score6" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score7" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score8" type="text" style="width:60px;text-align:right"/><br/>
<input id="Score9" type="text" style="width:60px;text-align:right"/><br/>
</td>

<td>
<input id="CurvedScore0" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore1" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore2" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore3" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore4" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore5" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore6" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore7" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore8" type="text" style="width:60px;text-align:right"/><br/>
<input id="CurvedScore9" type="text" style="width:60px;text-align:right"/><br/>
</td>

<td>
<input id="Grade0" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade1" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade2" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade3" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade4" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade5" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade6" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade7" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade8" type="text" style="width:60px;text-align:center"/><br/>
<input id="Grade9" type="text" style="width:60px;text-align:center"/><br/>
</td>
</tr>

<tr>
<td><input id="Average" type="text" style="width:60px;text-align:right"/></td>
<td><input id="CurvedAverage" type="text" style="width:60px;text-align:right"/></td>
<td>&nbsp;</td>
</tr>

<tr>
<td><input type="button" value="Load" style="width:60px;font-size:7pt"
onclick="LoadScores()"/></td>
<td><input type="button" value="Curve" style="width:60px;font-size:7pt"
onclick="CurveScores()"/></td>
<td><input type="button" value="Grades" style="width:60px;font-size:7pt"
onclick="AssignGrades()"/></td>
</tr>

</table>

<div style="position:relative; left:225px; top:-25px; font-size:10pt">
<b>Enter Scores: </b>
<input id="Scores" type="text" style="width:250px; font-family:courier new"
value="40,46,48,56,62,64,66,70,76,78"/>
</div>


</body>
</html>

jmrker
07-02-2011, 09:47 PM
Here's a more simplified version.
I tried to use most of your original code, but not always successful.
If you have a question as to why I removed a lot of your code, just ask

You did not define what the last column is supposed to represent,
so I just created a dummy function for it.



<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>

<script type="text/javascript">

var aScores = new Array(); //array to hold test scores
var aCurve = new Array(); //array to hold test scores with curve
var classAveRounded = 0; //average of test scores

//------------------- LoadScores function -----------------------------
function LoadScores() {
var classAve = 0;
aScores = document.getElementById("Scores").value.split(',');
aScores.sort(sortNumber); //sort the scores from highest to lowest

//insert scores from the array into the score text boxes.
for (i=0; i<aScores.length; i++) {
document.getElementById("Score" + i).value = aScores[i]; }

//total the test scores
var total=0;
for(i=0; i<aScores.length; i++) { total += parseInt(aScores[i]); }

//average the total and insert it into the Average textbox(Math.ceil rounds up aveCalc).
classAve = total/aScores.length;
classAveRounded = Math.ceil(classAve);
document.getElementById("Average").value = classAveRounded;
}


//------------------- sortNumber function ------------------------------
function sortNumber(a,b){ return b-a; }

//------------------- CurveScores function -----------------------------
function CurveScores() {
var classCurve = 0;
if(classAveRounded<75) { classCurve=(75-classAveRounded); }

var totalCurvedScores=0; //total the curved scores
var tmp = '';
for(i=0; i<aScores.length; i++) {
tmp = Number(aScores[i]) + Number(classCurve);
aCurve.push(tmp);
totalCurvedScores += tmp;
document.getElementById("CurvedScore" + i).value = tmp;
}
alert(aScores.join(' '));

//average the total and insert it into the CurvedAverage textbox(Math.ceil rounds up aveCalc).
curvedAve = totalCurvedScores/aCurve.length;
curvedAveRounded = Math.ceil(curvedAve);
document.getElementById("CurvedAverage").value = curvedAveRounded;
}

function AssignGrades() {
alert('Not coded yet');
}

</script>
<style type="text/css">
.inp { width:60px; text-align:right; }
</style>

</head>
<body>

<table border="1">
<tr style="background-color:#F0F0F0; font-size:10pt; font-weight:bold;
text-align:center; vertical-align:bottom">
<td>Score</td>
<td>Curved</td>
<td>Grade</td>
</tr>

<tr>
<td>
<input id="Score0" type="text" class="inp" /><br/>
<input id="Score1" type="text" class="inp" /><br/>
<input id="Score2" type="text" class="inp" /><br/>
<input id="Score3" type="text" class="inp" /><br/>
<input id="Score4" type="text" class="inp" /><br/>
<input id="Score5" type="text" class="inp" /><br/>
<input id="Score6" type="text" class="inp" /><br/>
<input id="Score7" type="text" class="inp" /><br/>
<input id="Score8" type="text" class="inp" /><br/>
<input id="Score9" type="text" class="inp" /><br/>
</td>

<td>
<input id="CurvedScore0" type="text" class="inp" /><br/>
<input id="CurvedScore1" type="text" class="inp" /><br/>
<input id="CurvedScore2" type="text" class="inp" /><br/>
<input id="CurvedScore3" type="text" class="inp" /><br/>
<input id="CurvedScore4" type="text" class="inp" /><br/>
<input id="CurvedScore5" type="text" class="inp" /><br/>
<input id="CurvedScore6" type="text" class="inp" /><br/>
<input id="CurvedScore7" type="text" class="inp" /><br/>
<input id="CurvedScore8" type="text" class="inp" /><br/>
<input id="CurvedScore9" type="text" class="inp" /><br/>
</td>

<td>
<input id="Grade0" type="text" class="inp" /><br/>
<input id="Grade1" type="text" class="inp" /><br/>
<input id="Grade2" type="text" class="inp" /><br/>
<input id="Grade3" type="text" class="inp" /><br/>
<input id="Grade4" type="text" class="inp" /><br/>
<input id="Grade5" type="text" class="inp" /><br/>
<input id="Grade6" type="text" class="inp" /><br/>
<input id="Grade7" type="text" class="inp" /><br/>
<input id="Grade8" type="text" class="inp" /><br/>
<input id="Grade9" type="text" class="inp" /><br/>
</td>
</tr>

<tr><th colspan="3">Totals</th></tr>

<tr>
<td><input id="Average" type="text" style="width:60px;text-align:right"/></td>
<td><input id="CurvedAverage" type="text" style="width:60px;text-align:right"/></td>
<td><input id="AssignAverage" type="text" style="width:60px;text-align:right"/></td>
</tr>

<tr>
<td><input type="button" value="Load" style="width:60px;font-size:7pt" onclick="LoadScores()"/></td>
<td><input type="button" value="Curve" style="width:60px;font-size:7pt" onclick="CurveScores()"/></td>
<td><input type="button" value="Grades" style="width:60px;font-size:7pt" onclick="AssignGrades()"/></td>
</tr>
</table>

<p>
<div>
<b>Enter Scores: </b>
<input id="Scores" type="text" style="width:250px; font-family:courier new"
value="40,46,48,56,62,64,66,70,76,78"/>
</div>
</body>
</html>

klondike
07-03-2011, 08:32 PM
Thanks!

jmrker
07-03-2011, 08:39 PM
Thanks!

You're most welcome.
Happy to help.
Good Luck!

klondike
07-03-2011, 08:56 PM
Thanks, that was definately very helpful. It helped a lot to see how someone with a lot more experience would have coded the same program. Why wouldnt you use slice to copy the contents from the array aScores to array aScores?

Thanks!

jmrker
07-03-2011, 10:37 PM
Thanks, that was definately very helpful. It helped a lot to see how someone with a lot more experience would have coded the same program. Why wouldnt you use slice to copy the contents from the array aScores to array aScores?

Thanks!

I assume you are referring to this section of code:


var totalCurvedScores=0; //total the curved scores
var tmp = '';
for(i=0; i<aScores.length; i++) {
tmp = Number(aScores[i]) + Number(classCurve);
aCurve.push(tmp);
totalCurvedScores += tmp;
document.getElementById("CurvedScore" + i).value = tmp;
}
// alert(aScores.join(' '));

I used the push instead of the slice function because I could do three things with the same loop:
1. Create the aCurve array in case I needed it elsewhere
2. Create the CurvedScore displays
3. Form the sum of the CurvedScores array

Note, you could delete the push code (or a slice function replacement) altogether since you don't seem to use the aCurve array elsewhere anyway.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum