Hi all... first off.. I stumbled across this recently while looking for some scripting info. I am in the middle of my level 1 javascript class & I am having a bit of a time trying to wrap my head around how arrays work when we want to gather information. for example.. I have a practical task : (it's actualy only one component of an assignment where I am to create a form that does all sorts of operations..like a take-out menu order that is functional) I have to: Create a htm file, that has a text box and two buttons. The first button is labelled “load name†the second is labelled “finishedâ€. Type a name in the box and when the “load name†button is clicked store that value into a new array element of an array called names. When the button labelled “finished†is clicked display the array elements (each on a separate line) and after the last name is displayed display a line telling how many names are in the list. If, when the “finished†button is clicked and there are no names in the list, display an alert to have the user enter in at least one name. I looked all through the w3 site, & thru all my books but I cant find any examples that model this. I have named my text box tb1, my form name is form1, so what I am wondering... would I create an new Array with 5 empty areas ..how do I name those fields if they are the value of the textbox? I am hoping someone can help shed some light on this for me. Any good advice would be greatly appreciatted. I am a nOob sincerly trying to learn & every thing I have tried has not worked. I am sure this is simple for many of you, If I could just see the code that would do this ..I am sure it will fall into place.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Any Title</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript"> var names = []; function loadName(nName){ if (nName.value != "") { document.getElementById('name_list').style.display = "none"; names[names.length] = nName.value; nName.value = ""; nName.focus(); } } function finished(){ if (names.length == 0) { alert('You must enter at least one name'); return; } var nDisplay = document.getElementById('name_list'); nDisplay.innerHTML = ""; nDisplay.style.display = ""; for (each in names) { nDisplay.innerHTML += names[each] + "<br>"; } if (names.length == 1) { nDisplay.innerHTML += "<br>" + "There is " + names.length + " name in the list"; } else { nDisplay.innerHTML += "<br>" + "There are " + names.length + " names in the list"; } names.length = 0; } </script> <style type="text/css"> body {background-color:#eae3c6;margin-top:60px;} form {width:260px;margin:auto;font-family:times;font-size:12pt;} fieldset {padding:5px;background-color:#f0fff0;border:1px solid #87ceeb;} legend {font-family:times;font-size:14pt;color:#00008b;background-color:#87ceeb;padding-left:3px;padding-right:3px;margin-bottom:5px;} .btn {display:block;margin-top:8px;} .display_list {width:245px;height:150px;overflow:auto;padding:5px;font-size:12pt;font-family:tahoma;margin-left:auto;margin-right:auto;margin-top:25px;border:1px solid #87ceeb;background-color:#f0fff0;} </style> </head> <body> <form action=""> <fieldset> <legend>Form</legend> <label>Name: <input type="text" name="user_input" size="25"></label> <input type="button" value="Load Name" class="btn" onclick="loadName(this.form['user_input'])"> <input type="button" value="Finished" class="btn" onclick="finished()"> </fieldset> </form> <div id="name_list" class="display_list" style="display:none"></div> </body> </html> Code (markup):
thanks a whole bunch Mike H. I am going to take a better look at this when I get home, I can see I was on the right track .. but I left out some crucial information. Thanks again!