Learn VBA & Macros in 1 Week!

JavaScript - How To Sum Elements In An Array?

Full Excel VBA Course - Beginner to Expert

How To Sum Elements In An Array?	View Content

I tried the following code based on a post I saw somewhere else about summing all the elements of an array together. When I tried it though I couldn't seem to get it working. Can someone please point out what I did wrong or tell me a different way to sum array elements together? Thanks.
Code:

<script type="text/javascript">

Array.prototype.sum = function() {
for (var i = 0, L = this.length, sum = 0; i < L; sum += this[i++]);
return sum;
}

var myArray=[1,2,3,4,5];

document.write(myArray.prototype.sum);

</script>

Full Excel VBA Course - Beginner to Expert

Sum Of Array Elements

Similar Tutorials

View Content

Hi again!!
This is my code to add and delete dynamic rows and auto calculate the amount field by multiplying qty and rate.

PHP Code:
<form name="staff_reg" action="<?php echo $_SERVER['PHP_SELF']."?".$_SERVER['QUERY_STRING']; ?>" method="post" enctype="multipart/form-data">

<table width="100%" border="0" cellspacing="0" cellpadding="2">

<table border="0" cellpadding="1" cellspacing="0" class="normal-text" align="left">

<tr align="center">

<td width="10" class="forhead" style="white-space:nowrap;"> </td>

<td width="92" class="forhead" style="white-space:nowrap;">Qty</td>

<td width="94" class="forhead" style="white-space:nowrap;">Rate</td>

<td width="94" class="forhead" style="white-space:nowrap;">Amount</td>

</tr>

</table>

<tr align="left">

<td class="forhead" style="white-space:nowrap;"><input type="button" value="Add Row" onClick="addRow('dataTable')" > 

<input type="button" value="Delete Row" onclick="deleteRow('dataTable')" ></td>

<table border="0" id="dataTable" cellpadding="1" cellspacing="0" class="normal-text">

<tr>

<td width="10" class="forhead" style="white-space:nowrap;"><input type="checkbox" name="chk[]"/></td>

<td width="92" class="forhead" style="white-space:nowrap;">

<input type="text"  name="qty[]"  style="width:80px;" onblur="">

</td>

<td width="94" class="forhead" style="white-space:nowrap;">

<input type="text"  name="rate[]" style="width:80px;" value=""></td>

<td width="94" class="forhead" style="white-space:nowrap;">

<input type="text"  onblur="getValues('qty[]','rate[]','amt[]')" name="amt[]" style="width:80px;"></td>

</tr>

</table>

<table border="0">

<tr>

<td>Total:</td>

<td><input type="text"  name="total[]" style="width:80px;" value=""></td>

</tr>

<tr>

<td colspan="2">

<input name="Submit" type="submit" value="Save" style="text-decoration:none" />

<input type="reset" value="Cancel" onclick="window.location.href='<?php echo $_SERVER['PHP_SELF'];?>'">

</td>

</tr>

</form>

<script type="text/javascript">

    function getValues(objName,objName2,objName3)

    {

        var var3 = "";

        var arr = new Array();

        arr = document.getElementsByName(objName);

        arr2 = document.getElementsByName(objName2);

        arr3 = document.getElementsByName(objName3);

        for(var i = 0; i < arr.length; i++)

        {

            for(var i = 0; i < arr2.length; i++)

            {

            for(var i = 0; i < arr3.length; i++)

            {



                var obj1 = document.getElementsByName(objName2).item(i);

                var var2 = obj1.value;

                var obj = document.getElementsByName(objName).item(i);

                var var1 = obj.value;

                var obj3 = document.getElementsByName(objName3).item(i);

                var var3 = obj3.value;

                var var4 = var1 * var2;

                document.getElementsByName(objName3).item(i).value=var4;

            }

            }

        }



    }



  function addRow(tableID) {

     var table = document.getElementById(tableID);

     var rowCount = table.rows.length;

     var row = table.insertRow(rowCount);

     var colCount = table.rows[0].cells.length;

           for(var i=0; i<colCount; i++) {

               var newcell = row.insertCell(i);

                newcell.innerHTML = table.rows[0].cells[i].innerHTML;

                //alert(newcell.childNodes);

                switch(newcell.childNodes[0].type) {

                    case "text":

                            newcell.childNodes[0].value = "";

                            break;

                    case "checkbox":

                            newcell.childNodes[0].checked = false;

                            break;

                    case "select-one":

                            newcell.childNodes[0].selectedIndex = 0;

                            break;

                }

            }

        }



function deleteRow(tableID)

{

            try

                 {

                var table = document.getElementById(tableID);

                var rowCount = table.rows.length;

                    for(var i=0; i<rowCount; i++)

                        {

                        var row = table.rows[i];

                        var chkbox = row.cells[0].childNodes[0];



                        if (null != chkbox && true == chkbox.checked)

                            {

                            if (rowCount <= 1)

                                {

                                alert("Cannot delete all the rows.");

                                break;

                                }



                            table.deleteRow(i);

                            rowCount--;

                            i--;

                            }

                        }

                    } catch(e)

                        {

                        alert(e);

                        }

}

</script>

I would like to know that how can I show the value of all the elements in array "amount" in total field??

Storing Array Elements

Similar Tutorials

View Content

Hey All,

I have completed most of a homework assignment that I am working on. I am able to .push desired elements into an array:

Code:

//Insert variable into the Array
function insertElem(){
	//Insert and sort first array, but not second array
	if(nameInput.value != ""){
		studName2.push(nameInput2.value);
	}
	else{
		alert("Value to be inserted cannot be Null");
	}
	
	//Refresh display area
	clearAndShow2();
}

What I would like to do is be able to store and display the created array "permanently" until I decide to remove the elements. My current method to hold the elements, until the page is refreshed, is:

Code:

//Refresh second array
function clearAndShow2(){
	nameInput2.value = "";
	messageBox2.innerHTML = "";
	messageBox2.innerHTML += "Groups: " + "<br />" + studName2.join("<br />") + "<br />";
}

I appreciate the assistance.

Checking Array Elements

Similar Tutorials

View Content

Hey guys. I need a little help with checking elements in my array. I created an array of size 50 and initialized all elements to 1. What i want to do is if the user types in the number "1" into the prompt box, i want it to check the first 15 elements and increase only one of the elements by 1, and if the element has already been increased by 1 then i want it to check the next element and see if its been increased, if the element has been increased then it needs to move on to the next one and check that. If the element is 1, then it can be increased by "1", if the element is 2 then i need it to check the next element. If all elements within the first 15 have increased by 1, it should just alert the user that all slots have been assigned. Is there a way to do this? Thanks for your time

Array Elements That Infuriate Me.

Similar Tutorials

View Content

Using Form Elements In Array

Similar Tutorials

View Content

Hi,

I'm pulling my hair out to create a simple function!

I am creating an array based on form elements. I then am trying to create an IF (and nested IF) statement to check if the fields are empty and then with the nested IF statement use certain fields to create mathematical functions.

So far I have this:

function QuantityMWh(form) {

var formchk = document.forms[0]
for (i = 0; i < formchk.elements.length; i++) {
if (formchk.elements[1].value == "" && formchk.elements[2].value == "") {
alert("Please fill out all fields.")
break
}
}

}

It's only checking the first field and not the second, and vice versa. i.e. if only one field has text then it passes.

What am I doing wrong?

Thanks.

Set Value Of Array Of Form Elements

Similar Tutorials

View Content

Hi Folks - I have a form that has an array of input values:

<input type="text" name=txtValue[] />
<input type="text" name=txtValue[] />

I do this so I can loop through the values in php... now...that's the easy part... the hard part comes to this:

next to each of those boxes is a search button that allows the user to open up a popup window that they can search for an item, and select the item. Once they select the item it should populate that particular input box with the selected item. I can easily do this with a uniquely named input box, but can't seem to figure out how to do it with an array of input boxes... any idea?

Prefill All Array Elements With Data

Similar Tutorials

View Content

Hi All,

Simple newbie question here - I want to initialize an array with "myString.length" elements, and I want every element to be prepopulated with "*" instead of blank. Is there any way of doing this? Code:

 

var myString = '123456';

var trialVar = new Array[myString.length]
	
document.write('TEST ' + '<BR><BR>' + trialVar);

(I want every element of trialVar to be "*", I cant just manually add them as myString.length will vary)

Any help would be mega appreciated - thank you

Some Help Required With Passing Array Elements

Similar Tutorials

View Content

Hi Guys

I am new to javascript programming and I am trying to get elements from one array to another, here is an example of what I am trying to do;

Code:

oneArray[0] = anotherArray[10];

Essentially, moving the data in index 10 of anotherArray to the index 0 of oneArray. I have tried using a variable as a place holder such as;

Code:

placeHolder = anotherArray[10];
oneArray[0] = placeHolder;

I know i'm doing something idiotic somewhere along the line, I just can't figure out what I need to do.

Adding Form Elements To An Array

Similar Tutorials

View Content

Javascript Array Within Form Checkbox Elements

Similar Tutorials

View Content

Guys,

For some reason my script only works when I have at lease two checkboxes.

To simulate the problem just run it once with two html input checkbox elements
-> check one checkbox and press submit -> it works
-> Now remove one input checkbox field and check the remaining checkbox & submit -> Bamm doesn't work...

What am I doing wrong ?

Code:

<html> 
<head> 
            <script> 
            function Check(chk) 
            { 
            for (i=0; i < chk.length; i++) chk[i].checked=document.ListActionForm.Check_ctr.checked ; 
            } 
        function desubmit() 
            { 
            if(get_args()==false) {alert("nothing_selected");return false;} 
            if(labelling(true)) return false; 
            } 
            function labelling(s) {return true;} 
        function get_args() 
            { 
            s=chkboxa2str(document.ListActionForm['listaction[]']); 
            if(s)alert(s); 
            if(s.length<8)return false; 
            else return s; 
            } 
            function chkboxa2str(chkbox_a) {  
            var list = "";  
                for(var i = 0; i < chkbox_a.length; i++){ if(chkbox_a[i].checked) { list += chkbox_a[i].value + " "; } } 
            return list;  
            } 
            </script> 
</head> 
<body> 
<form action="?h=1296078874" method="post" name="ListActionForm" onsubmit="return desubmit()"> 
<input type='checkbox' name='listaction[]' value='2010102909103530'> Testbox 1<br> 
<input type='checkbox' name='listaction[]' value='2010102909103532'> Testbox 2<br> 
<input type="Submit" name="Submit" value="Versturen" > 
</form> 
</body> 
</html>

Adding Js To Old Html: Referencing Array Elements

Similar Tutorials

View Content

Years ago I created HTML that employs checkboxes and textboxes. I am now writing JS with the intention of adding flexibility and limiting redundancy. I am not sure I truly understand how to correctly interact the two though. For example, one of my scripts have arrays that contain the names of the checkboxes and textboxes, with a 'for' loop to document.write() them to references within the HTML code. This does not seem to be working for me though. Here is what I have thus far (in short):

Code:

<script language="javascript"> 
var teamNames = new Array(3);
 
teamNames[0]="South Africa";
teamNames[1]="Mexico";
teamNames[2]="Uruguay";

for (i=0; i<=31; i++) {
document.write("<p>" + teamNames[i] + "<\/p>");
}
</script>
</head>
<body>
<tr><td>Jun 11</td><td><input type="checkbox" 
name="teamNames[0]" value="teamAbbr[0]"></td>
</body>

I've left out a lot of the code (to include the teamAbbr array, but you get the points. I've tried moving the JS within the HTML body and playing with the reference syntax, but nothing so far. Any help would be great!

How To For-loop Php Array ($_post) Elements Correctly In Js

Similar Tutorials

View Content

I wrote js functions to reset a php form (multiple questions). The below works:

Code:

function resetForm(){
  	   resetGroup(document.forms[0].answer1);
  	   resetGroup(document.forms[0].answer2);
	}

Answer1 and answer2 are the elements of $_POST array. (<input name="answer1"> in php). In this example, I tried with only two questions, but I have up to 35 questions in one form. Instead of writing the above resetGroup() 35 times, I want to for-loop it. I tried

Code:

function resetForm(){
	   for (var i=1; i<3; i++){
  	   resetGroup(document.forms[0]."answer"+i);
	}

That didn't work. Could someone help me to make the loop work? Or would someone have better or simpler idea? Thanks.

Dynamic Color Change Of Array Elements

Similar Tutorials

View Content

Hi, I am stumped. I have been trying unsuccesfully for three days to figure something out, and it has brought me here. I am a noob javascripter, so please bear with me.

I have created a page with an input button that refers to a function:
Code:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
    <meta name="created" content="Thu, 26 May 2011 03:39:57 GMT">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <title>Meltmedia Web Intern Test</title>
    
    <style type="text/css">
    <!--
    body {
      color:#000000;
      background-color:#FFFFFF;
    }
    a  { color:#0000FF; }
    a:visited { color:#800080; }
    a:hover { color:#008000; }
    a:active { color:#FF0000; }
    -->
    </style>
    <!--[if IE]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
<LINK REL=StyleSheet HREF="what.css" TYPE="text/css" MEDIA=screen>

<script type="text/javascript">

//function ChangeBackground()
 		 <!--{
//		  	document.getElementById("column2").style.backgroundColor="#ffbdaa";
//			document.getElementById("row1").style.backgroundColor="#ffbdaa";
//			document.getElementById("row3").style.backgroundColor="#ffbdaa";
//			document.getElementById("row4").style.backgroundColor="#ffbdaa";
//			document.getElementById("mainbody").style.backgroundColor="#f7d7cd";
// } -->
 
function ChangeBackground() {
	var colors = document.getElementsByClassName("changeme");	
	//alert(colors.length);
		for (var i = 0; i < colors.length; i++) {
			if (colors[i].className="changeme") {
				colors[i].style.backgroundColor="ffbdaa";
				}
			
	}
}
//if (document.getElementsByClassName('changeme')[5].style.backgroundColor="#e8e8e00") {
//       document.getElementsByClassName('changeme')[5].style.backgroundColor="#ffbdaa";
//  }
//div1 original color is #e8e8e8
//div2 original color is #e2ebe4
//tablerows original color is #ccddd0
 </script>

 
 </head>
 
<body>
<div id="mainbody" class="changeme">
<img id="header" src="osx_header.jpg">


<div id="inset">
<div id="column1" class="column1">

<p class="text0">Lorem Ipsum Dolor Sit Amet</p>
<p class="text1">Lorem ipsum dolor sit amet, 
   					   consectetur adipiscing elit. 
					   Aenean sed est et mi varius 
					   euismod sed nec neque. Lorem ipsum dolor sit amet, 
					   consectetur adipiscing elit. Maecenas ultricies pulvinar lacinia. 
<a href="http://www.google.com/" rel="nofollow" target="_blank" style="color:blue">This is a link.</a> 
   </p>

<p class="text1" style="font-size:16px;">Lorem Ipsum Dolor Sit Amet</p>
<p class="text1">Sed a felis et eros gravida dignissim. 
   					 Quisque lobortis magna non purus vulputate 
					 pellentesque. Mauris sit amet felis felis. 
					 Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
					 Nullam molestie lacinia arcu vitae pretium.<sup>2.3</sup>
					 </p>

	<div id="unordered_list">
		<ul id="blue_bullets">
			<li>Vestibulum ante erat, laoreet quis pellentesque quis, 
			tincidunt fermentum turpis.
			<li>Maecenas in mollis massa.
					<ul>
						 <li>Ut tempus tincidunt molestie. Phasellus eget nulla 
						 id erat scelerisque porttitor vel pharetra nibh.
						 <li>Class aptent taciti sociosqu ad litora torquent per 
						 conubia nostra, per inceptos himenaeos.
					</ul>
			<li>Aenean ligula massa, tempor sed pulvinar sit amet, imperdiet a nisi.
		</ul>			
	</div><!--end of ordered list-->
	
	<div id="button">

        <!--	<img src="btn-click-here.gif">  -->
		<input type="button" onClick="ChangeBackground()" value=" ">
  
	</div><!--end of button-->
		
	<table id="table1">
		<tr id="firstrow">
			<th id="row1" class="changeme"></th>
			<th id="row2" class="changeme"><strong>header1</strong></th>
			<th id="row3" class="changeme"><strong>header2</strong></th>
			<th id="row4" class="changeme"><strong>header3</strong></th>
			</tr>
		<tr>
			<td>one</td>
			<td>1234</td>
			<td>bears</td>
			<td>abcd</td>
			</tr>
		<tr>
			<td>two</td>
			<td>5678</td>
			<td>beets</td>
			<td>efgh</td>
			</tr>
		<tr>
			<td>three</td>
			<td>9101</td>
			<td>battlestar</td>
			<td>ijkl</td>
			</tr>
		<tr>
			<td>four</td>
			<td>1121</td>
			<td>galactica</td>
			<td>mnop</td>
			</tr>
	</table>
	<!--end of table-->

<ol class="ordered">
	<li>Integer molestie sodales risus eu commodo. <i>Duis eget est  
    dapibus neque congue</i> accumsan id eu nibh. 
	</li>
	<li>Proin malesuada hendrerit lobortis. Integer et erat leo. 
    Praesent nec justo nulla. <i>Sed in dolor id neque faucibus 
    consequat.</i> 
	</li>
	<li>Vestibulum sit amet justo id <strong>risus tempus ornare.</strong> Etiam 
    faucibus urna volutpat lorem dictum imperdiet. 
	</li>
</ol>

</div> <!--end of column1-->

<div id="column2" class="changeme">
<p class="text00"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong></p>
<p class="text2">Aenean sed est et mi varius euismod sed nec neque. 
   						Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas 
						ultricies pulvinar lacinia. Sed a felis et eros gravida dignissim. 
						Quisque lobortis magna non purus vulputate pellentesque.</p>
<p class="text2">Mauris sit amet felis felis. Lorem ipsum dolor 
   						sit amet, consectetur adipiscing elit. Nullam molestie lacinia arcu 
						vitae pretium. Vestibulum ante erat, laoreet quis pellentesque quis, 
						tincidunt fermentum turpis. Maecenas in mollis massa. Ut tempus 
						tincidunt molestie.</p>
<p class="text2">Phasellus eget nulla id erat scelerisque porttitor 
   						vel pharetra nibh. Class aptent taciti sociosqu ad litora torquent 
						per conubia nostra, per inceptos himenaeos. Aenean ligula massa, tempor 
						sed pulvinar sit amet, imperdiet a nisi. Nulla ullamcorper posuere dolor, 
						ac rutrum velit sollicitudin ac. Ut felis leo, ultricies a bibendum ac, 
						luctus semper massa.</p>

</div> <!--end of column2-->

</div> <!--end of inset-->

</div>
</body>
</html>

i would like to change certain style elements of the array each time the button is clicked. I have 5 color sets i would like use for the page, so i would like the button to trigger the color change in a loop, ie when the last color group is reached, the next click returns to the original color set and it continues again.

This is a demo page, not for actually publication. I am trying to teach myself javascript and this is an idea that came to me.

The things i want to change are the background color of two div's and the top row of a table. My style sheet is seperate, and I will also do the same for the javascript once I can get it to work properly.

Thank you in advance for any help.

Problem Comparing Screenx,y To Array Elements

Similar Tutorials

View Content

I'm writing a simple Chess Record keeping app (still ), and i'm having a problem with the Screen.X and Screen.Y variables to compare with the coordinate variables stored in an Array.
The project is a little large, so here's the live version (on my website). Though it will only work if you run it from your local disk.

http://daomingjin.googlepages.com/ScoreMate.html

the zip archive of this is he

http://daomingjin.googlepages.com/ScoreMatev1.zip

the main JavaScript function file is he

http://daomingjin.googlepages.com/Core.js

the particular function in question is this:

Code:

var PieceThere = isPieceHere(ClosestX, ClosestY);


function isPieceHere(x, y)
{
 // Test to see if there is an Element at  point  x,y
 for (var i = 0; i < 32; i++)
     {
	  if (PieceLocationXcoord[i] == x)
	     {
	      if(PieceLocationYcoord[i] == y)
		     {
			  // There is a piece there
			  var Result = "True";
			 }
		 }
	 }
return Result;
}

i have placed alert() boxes in many places in the code above, and i can tell the following:
the function is being activated the coordinates of x and y are able to be accessed inside the function the arrays called PieceLocationYcoord and PieceLocationXcoord both have the values in them that are returned by the ClosestX and ClosestY function
however, every time , the function continues to return "Undefined". I have even tried manually setting var Result = "True" inside the last if-then block, and still returns undefined.
i have also tried using the alert box inside this function (before the variable return Result; is called) and still get undefined as the message from the alert box.

Comparing Elements In An Array To Letters In A String

Similar Tutorials

View Content

Hi all,

Forgive my ignorance, I'm quite new to Javascript...

I'm looking to do two things: the first is to move elements of an array to the next index using a function. I have managed to do this like so:

Code:

var letters = ['h','i','j','k'];
function moveElements(anArray){

var newArray = anArray;
newArray.unshift(newArray[newArray.length-1]);
newArray.pop();
}
moveElements(letters);

(this may or not be great, but it seemed to work) ... but I want the original array to reset to its original state if the function is called again (thus producing the same answer as opposed to shifting the elements again).

Secondly, and this is the bit I'm really struggling with: I want to compare each letter of a string to elements within an array and display the indices. For instance:

Code:

var myArray = ['a', 'b', 'c', 'd', 'e', 'f'];
var text = 'dead';

Hence I want the result '3,4,0,3'.

I know the answer will use for and if statements but I can't wrap my head around it at all. Help would be appreciated, thank you.

Problem Accessing Form Array Elements

Similar Tutorials

View Content

I am very new to javascript. I have a problem getting to any element from this form generated by the jsp page using struts. Please show me how to get to item[0].totalAmount for example, so that I can create a function to calculate the calculateTotal(). So far, when I do the alert, it is only valid up to
document.myForm.item; the document.myForm.item[0] is invalid according to the alert. Any help is very much appreciated.

function calculateTotal(){
alert(document.myForm.item);
}
<form name="myForm" method="post" action="/myAction.do">
<table id="display" border="1">
<tr>
<th scope="col" id="totalAmount">Total Amount</th>
<th scope="col" id="adjustmentAmount>Adjustment Amount</th>
<th scope="col" id="newAmount">NewAmount</th>
</tr>
<tr>
<td><input type="text" name="item[0].totalAmount" id="totalAmount" value="100" readonly="readonly"></td>
<td><input type="text" name="item[0].adjustmentAmount" id="adjustmentAmount"
value="" onblur="javascript:calculateTotal();" readonly="readonly"></td>
<td><input type="text" name="item[0].newAmount" id="newAmount" value="" readonly="readonly"></td>
</tr>
<tr>
<td><input type="text" name="item[1].totalAmount" id="totalAmount" value="350" readonly="readonly"></td>
<td><input type="text" name="item[1].adjustmentAmount" id="adjustmentAmount"
value="" onblur="javascript:calculateTotal();" readonly="readonly"></td>
<td><input type="text" name="item[1].newAmount" id="newAmount" value="" readonly="readonly"></td>
</tr>
</table>
</form>

Are Style Elements Counted In Document.stylesheets Array?

Similar Tutorials

View Content

I have one question about <style> elements, are they counted in document.styleSheets array? and can I add rules to them by using insertRule() and deleteRule() methods?

Getting All Elements

Similar Tutorials

View Content

Ok so I have these Input boxes and select boxes on my form. I have them input this way:

Code:

<input type="text" name="monto[]">

So I can then parse the many that get added and removed when I submit the form, this way PHP see's them as an array.

Now I have used this in the past to cycle through my inputs to check values and such on them, but with these [] it doesn't work.

Code:

var changeCheck = document.getElementsByName('check');
	for(i=0; i<changeCheck.length; i++)
	{
		var enter = new Number(getEl('dueitem' + changeCheck[i].value));
		
		if(changeCheck[i].checked == true) {
			final = enter + final;
		}
	}

Is there a way to cycle all these elements when they are as []. Even if it's cycle them by name, though I never had a determined amount I always have the same names for the 12 different fields there are.

For... In Has Extra Elements

Similar Tutorials

View Content

I have a webpage which has the prototype library in it as well as my own script. I just started on it, but I've already run into issues using the for... in loop. I'll admit, I'm a complete noob at javascript, so this is probably something pretty simple.
Code:

function prepareToolBar()
{
	//define toolbar tool names
	var toolbar = [
		'line',
		'circle',
		'ellipse',
		'square',
		'rectangle',
		'text'];
	
	for (var i in toolbar)
	{
		var tmp = document.createElement("p");
		tmp.appendChild(document.createTextNode(toolbar[i]));
		document.body.appendChild(tmp);
	}
}
addLoadEvent(prepareToolBar);

function addLoadEvent(func)
{
	var oldonload = window.onload;
	if (typeof oldonload != 'function')
	{
		window.onload = func;
	} else {
		window.onload = function() { oldonload(); func(); }
	}
}

Below is the output on the page from the function:
Code:

circle

ellipse

square

rectangle

text

function (iterator, context) { var index = 0; iterator = iterator.bind(context); try { this._each(function (value) {iterator(value, index++);}); } catch (e) { if (e != $break) { throw e; } } return this; }

function (number, iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var index = - number, slices = [], array = this.toArray(); while ((index += number) < array.length) { slices.push(array.slice(index, index + number)); } return slices.collect(iterator, context); }

function (iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var result = true; this.each(function (value, index) {result = result && !!iterator(value, index);if (!result) {throw $break;}}); return result; }

function (iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var result = false; this.each(function (value, index) {if ((result = !!iterator(value, index))) {throw $break;}}); return result; }

function (iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var results = []; this.each(function (value, index) {results.push(iterator(value, index));}); return results; }

function (iterator, context) { iterator = iterator.bind(context); var result; this.each(function (value, index) {if (iterator(value, index)) {result = value;throw $break;}}); return result; }

function (iterator, context) { iterator = iterator.bind(context); var results = []; this.each(function (value, index) {if (iterator(value, index)) {results.push(value);}}); return results; }

function (filter, iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var results = []; if (Object.isString(filter)) { filter = new RegExp(filter); } this.each(function (value, index) {if (filter.match(value)) {results.push(iterator(value, index));}}); return results; }

function (object) { if (Object.isFunction(this.indexOf)) { if (this.indexOf(object) != -1) { return true; } } var found = false; this.each(function (value) {if (value == object) {found = true;throw $break;}}); return found; }

function (number, fillWith) { fillWith = Object.isUndefined(fillWith) ? null : fillWith; return this.eachSlice(number, function (slice) {while (slice.length < number) {slice.push(fillWith);}return slice;}); }

function (memo, iterator, context) { iterator = iterator.bind(context); this.each(function (value, index) {memo = iterator(memo, value, index);}); return memo; }

function (method) { var args = $A(arguments).slice(1); return this.map(function (value) {return value[method].apply(value, args);}); }

function (iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var result; this.each(function (value, index) {value = iterator(value, index);if (result == null || value >= result) {result = value;}}); return result; }

function (iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var result; this.each(function (value, index) {value = iterator(value, index);if (result == null || value < result) {result = value;}}); return result; }

function (iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var trues = [], falses = []; this.each(function (value, index) {(iterator(value, index) ? trues : falses).push(value);}); return [trues, falses]; }

function (property) { var results = []; this.each(function (value) {results.push(value[property]);}); return results; }

function (iterator, context) { iterator = iterator.bind(context); var results = []; this.each(function (value, index) {if (!iterator(value, index)) {results.push(value);}}); return results; }

function (iterator, context) { iterator = iterator.bind(context); return this.map(function (value, index) {return {value: value, criteria: iterator(value, index)};}).sort(function (left, right) {var a = left.criteria, b = right.criteria;return a < b ? -1 : a > b ? 1 : 0;}).pluck("value"); }

function () { return [].concat(this); }

function () { var iterator = Prototype.K, args = $A(arguments); if (Object.isFunction(args.last())) { iterator = args.pop(); } var collections = [this].concat(args).map($A); return this.map(function (value, index) {return iterator(collections.pluck(index));}); }

function () { return this.length; }

function () { return "[" + this.map(Object.inspect).join(", ") + "]"; }

function (iterator, context) { iterator = iterator.bind(context); var result; this.each(function (value, index) {if (iterator(value, index)) {result = value;throw $break;}}); return result; }

function (iterator, context) { iterator = iterator.bind(context); var results = []; this.each(function (value, index) {if (iterator(value, index)) {results.push(value);}}); return results; }

function (object) { if (Object.isFunction(this.indexOf)) { if (this.indexOf(object) != -1) { return true; } } var found = false; this.each(function (value) {if (value == object) {found = true;throw $break;}}); return found; }

function () { return this.map(); }

function reverse() { [native code] }

function forEach() { [native code] }

function () { this.length = 0; return this; }

function () { return this[0]; }

function () { return this[this.length - 1]; }

function () { return this.select(function (value) {return value != null;}); }

function () { return this.inject([], function (array, value) {return array.concat(Object.isArray(value) ? value.flatten() : [value]);}); }

function () { var values = $A(arguments); return this.select(function (value) {return !values.include(value);}); }

function (sorted) { return this.inject([], function (array, value, index) {if (0 == index || (sorted ? array.last() != value : !array.include(value))) {array.push(value);}return array;}); }

function (array) { return this.uniq().findAll(function (item) {return array.detect(function (value) {return item === value;});}); }

function () { return [].concat(this); }

function () { var results = []; this.each(function (object) {var value = Object.toJSON(object);if (!Object.isUndefined(value)) {results.push(value);}}); return "[" + results.join(", ") + "]"; }

As you can see, it shows the 6 elements in the array that I want, but it also shows random elements.

By the way, I can fix this by changing it to a normal for loop, but I want to know what I'm doing wrong.

Hiding Elements Without Ids

Similar Tutorials

View Content

Hi,

I got a table with hundreds of rows...and I want the user to be able to hide a single one by clicking on the table row.

How can I do this without typing in hundreds of ids like 1,2,3,4,5... Since you can't get elements by class and ids have to unique I'm not sure how to do this. Also the order of the rows will change when they get updated so it would end up being a mess of unordered ids.

Thanks.