Member Avatar for Atomika3000

i'm trying to make an app that lets the user add two items from a text box go into a 2d array and be able to repeat this as many times as they desire, each time adding it onto the end of the array. Then when the user presses a button, it goes and shows the list of items entered.

The thing is, Internet Explorer keeps telling me "Done, but with errors on the page" when i click the button to show. and i click to find out more, and it says

'array' is undefined on line 17

Can somebody tell my what this means (simply) and then explain how i can rectify this problem?

<html>
<head>
<title>Grader 101</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
body,td,th {
	font-family: Calibri, Tahoma, Arial Narrow;
	font-size: 12pt;
}
-->
</style>
<script type="text/javascript">
//var studentArray = new array()
//var arrayNum 
var myArrayNumOne
myArray = new array(100)
//arrayNum = 1;
myArrayNumOne = 1
function arrayStuff(p1, p2)
{
		myArray[myArrayNumOne] = newArray(2)
		myArray[myArrayNumOne][0] = p1
		myArray[myArrayNumOne][1] = p2
		myArrayNumOne = myArrayNumOne + 1
}

function readArray()
{
	for(var i=0; i<myArrayNumOne; i++)
	{
			document.write(myArray[i][0] + " scored " + myArray[i][1] + "<br>")
	}
}

/*function WriteCookie()
{

	var allowed=/^[a-zA-Z]+$/;

	if(document.gradeAdd.studentName.value.match(allowed))
	{

	cookievalue=escape(document.gradeAdd.studentName.value)+";";
	cookievalue2=escape(document.gradeAdd.studentGrade.value)+";";
	document.cookie=cookievalue  + " scored: "  + cookievalue2;
	studentArray[arrayNum]=document.cookie;
	alert(document.cookie);
	}
	else
	{
		alert("Enter a valid name");
		return;
	}
	arrayNum = arrayNum+1;
}

function ReadCookie()
{
	var i;
	for(i=0; i<arrayNum; i++)
	{
		document.write(studentArray[i]);	
	}
   /*var allcookies = document.cookie;
   alert("All Cookies : " + allcookies );

   // Get all the cookies pairs in an array
   cookiearray  = allcookies.split(';');

   // Now take key value pair out of this array
   for(var i=0; i<cookiearray.length; i++)
  {
      name = cookiearray[i].split('=')[0];
      value = cookiearray[i].split('=')[1];
      alert("Key is : " + name + " and Value is : " + value)
   }*/
</script>

</head>
<body class="oneColFixCtrHdr">

<div id="container">
  <div id="header">
    <h1>Grader 101  </h1>
  </div>
  <div id="mainContent">
    <form name="gradeAdd" method="post" action="">
      <p>Please enter the student name and the number of marks achieved</p>
      <table width="1211" border="0">
        <tr>
          <td width="113">Student Name:</td>
          <td width="120"><input type="text" name="studentName" size="20"></td>
          <td width="15">&nbsp;</td>
          <td width="124">Student Grade:</td>
          <td width="120"><input type="text" name="studentGrade" size="20"></td>
          <td width="86"><label>
            <input type="submit" name="addItem" id="button" value="Add Details" onClick="arrayStuff(studentName.value, studentGrade.value)">
          </label></td>
          <td width="105"><label>
            <input type="submit" name="clearRecords" id="button2" value="Clear Records">
          </label></td>
          <td width="494">
          You have approximately   records
          </td>
        </tr>
      </table>
    </form>
    <hr>
    <p>Below are your options to: View the Marks, Show the Mean, Show the Standard Deviation, Show a Graph</p>
    <table width="550" border="0">
      <tr>
        <td><input type="button" name="showMarks" value="Show the Marks" onClick="readArray()"></td>
        <td></td>
        <td><input type="button" name="showMean" value="Show the Mean"></td>
        <td>&nbsp;</td>
        <td><input type="button" name="showStdDev" value="Show the Standard Deviation"></td>
        <td>&nbsp;</td>
        <td><input type="button" name="showGraph" value="Show a Graph"></td>
      </tr>
    </table>
    <hr>
    <p>&nbsp;</p>
</div>
</div>
</body>
</html>
  • 2 Contributors
  • 1 Reply
  • 248 Views
  • 16 Hours Discussion Span
  • Latest Post Latest Post by Airshow
Member Avatar for Airshow

This page won't work in its current form for a couple of reasons.

Firstly, by using a submit button for Add Details, the form will be submitted and the page will reload. This effectively means that no entries can accumulate in the Javascript array.
Solution: Change "Add Details" to type="button"

Secondly, any document.write() after the page has fully loaded will overwrite the entire document including all Javascript code and values, so again no entries can accumulate in the Javascript array.
Solution: Hard code a <div> in which to display your records and use DOM methods inside your for loop to build the list. I suggest you investigate :

  • document.getElementById()
  • document.createElement()
  • document.createTextNode()
  • element.appendChild()
  • element.html

I will let you have fun doing that for yourself.

Meanwhile, the opening statements of your Javascript can be simplified (and improved) to :

var myArray = [];//new array
function arrayStuff(p1, p2) {
	if(!p1 || !p2) {//validate input data
		alert('Null entry');//Tell user the data is faulty
		return;//abort th function
	}
	myArray.push( [p1, p2] );//create new array containing p1 and p2, and append to the end of myArray.
}

Airshow

Edited by Airshow because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.