# Arrays And Showing As Undefined

## 17 January 2016 - 1 answer

My project is to make a class report based on the amount of students and marks. In my project I need to show student names and marks, the average, and the lowest and highest grade in the class. In my code, when I get to the part where I post the class report, the last student's name and mark is read as undefined and undefined. It then affect my average which is read as NaN and lowest and highest mark. If anyone could fix my code that would be amazing! An explanation on what I did wrong is greatly appreciated as well.

``````<script type="text/javascript">
var Names = [];
var Marks = [];
var sum = 0;
var average = 0;
var lowest = 99999999;
var lowestStudent;
var highest = -10000000;
var highestStudent;

\$("#btnBoxes").click(function(){
\$("#divOutput1").hide();
var number = GetInteger("txtNumber");

if (number >= 1){
GenerateTextandButton(number);

\$("#btnReport").click(function(){
\$("#divOutput2").hide();
InputintoArrays(number);
CalculateAverage();
ChecklowestMark();
CheckhighestMark();
Report();
});

}else{

\$("#divOutput2").html("Please insert a number greater than 1.");

}
});

function GetInteger(num){
var number = parseInt(\$("#"+ num).val());
if(isNaN(number) === true){
return 0;
}else{
return number;
}
};
function GenerateTextandButton(x){
for(y=1;y<=x;y++){
\$("#divOutput2").append("Student " + y + "<br><input type='text' id='txtName" + y + "' value='Insert Name'><br><input type='text' id='txtMark" + y + "' value='Insert Mark'><br><br>");
}
\$("#divOutput2").append("<br><input type='button' id='btnReport' value='Generate'>");
};

function InputintoArrays(x){
for(y=1;y<x;y++)
Names[y]=\$("#txtName" + y).val();
Marks[y]=parseInt(\$("#txtMark" + y).val());
}
};
function CalculateAverage(){
for(y=1;y<=Marks.length;y++){
sum = sum + Marks[y];
}
average = sum / Marks.length;

};

function ChecklowestMark(){

for(y=1;y<=Marks.length;y++){
if(Marks[y] <= lowest){
lowest = Marks[y];
lowestStudent = Names[y];
}
}
};

function CheckhighestMark(){

for(i=1;i<=Marks.length;i++){
if(Marks[i] >= highest){
highest = Marks[i];
highestStudent = Names[i];
}
}
};

function Report(){

\$("#divOutput3").html("<b>Marks:</b> <br><br>");
for(y=1;y<=Marks.length;y++){
\$("#divOutput3").append("<i>" + Names[y] + '</i>: ' + Marks[y] + "<br>");
}
\$("#divOutput3").append("<br><u>Average Mark:</u> " + average.toFixed("2"));
\$("#divOutput3").append("<br><u>Lowest Mark:</u> <i>" + lowestStudent + "</i> " + lowest);
\$("#divOutput3").append("<br><u>Highest Mark:</u> <i>" + highestStudent + "</i> " + highest);
};
``````

Your loops are typically written as follows:

``````for (y = 1; y <= Marks.length; y++) { ... }
``````

which is ok, but most programmers do this instead:

``````for (y = 0; y < Marks.length; y++) { ... }
``````

This means you are accessing Names, Names and Names (rather than Names, Names and Names which would be more conventionally correct).

Now, note that in your function

``````function InputintoArrays(x){
for(y=1;y<x;y++) {
Names[y]=\$("#txtName" + y).val();
Marks[y]=parseInt(\$("#txtMark" + y).val());
}
};
``````

your control says `for(y=1;y<x;y++)` rather than `for(y=1;y<=x;y++)`, so you weren't inserting the final name. Change `y<x` to `y<=x` and all should be fine. Or even better, start all your control loops from 0 and test using `<` rather than `<=`.