Help with simple JavaScript page for school?

**Iconoclast** · 01-26-2009, 09:31 AM

EDIT: Nevermind guys, I managed to figure it all out!

Hi guys, I have an assignment for school that I'm working on that should be really simple, but for some reason it doesn't seem to want to work for me...here are the instructions I am to follow:

Steps:
1. Create a web page that utilizes drop-down lists, check boxes, radio buttons, and textboxes in a form to collect information from a user.
2. On click of a buttton execute a javascript function that will determine the form's control settings and output the information to a textarea.
3. Store a brief list of comic book titles in an array.
4. On Form Load add list items to the drop down list using a loop and the array.
5. Come up with other appropriate uses for the requested controls.

Pretty straightforward...now, I know quite a bit about JavaScript and maybe a little bit more, but I am by no means an expert (hence why I need help at this point). Here's the code for the page that I've tried to develop, but it doesn't seem to do what I want it to:

Code:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Web Management - Lab 1</title>

<script type="text/javascript">

function addOption(selectbox,text,value )
{
	var optn = document.createElement("OPTION");
	optn.text = text;
	optn.value = value;
	selectbox.options.add(optn);
}

function addOption_list(selectbox)
{
	var comicBooks = new Array("Batman","Spiderman","Hulk","X-Men","Superman");
	for (var i=0; i < comicBooks.length;++i)
		{
			addOption(document.myForm.comicList, comicBooks[i], comicBooks[i]);
		}
}

function doStuff(x)
{
	
	var interests = "";
	
	if (x.sports.checked)
		{
			interests = interests + "Sports, ";
		}
	if (x.videogames.checked)
		{
			interests = interests + "Video Games, ";
		}
	if (x.televisionmovies.checked)
		{
			interests = interests + "Television/Movies, ";
		}
	if (x.webdesign.checked)
		{
			interests = interests + "Web Design, ";
		}
	if (x.programming.checked)
		{
			interests = interests + "Programming, "
		}
	if (x.other.checked)
		{
			interests = interests + "Other";

	printStuff(document.myForm);
}

function printStuff(x)
{
	document.myForm.outputResults.value = "Name: " + document.myForm.name.value + "\nAge: " + document.myForm.age.value + "\nSex: " + document.myForm.sex.value + "\n\nInterests: " + interests"
}

function handleErr(msg,url,l)
{
	txt="There was an error on this page.\n\n";
	txt+="Error: " + msg + "\n";
	txt+="URL: " + url + "\n";
	txt+="Line: " + l + "\n\n";
	txt+="Click OK to continue.\n\n";
	alert(txt);
	return true;
}
onerror=handleErr;

</script>

</head>

<body>

<form name="myForm">

<strong>Personal Information:</strong><br />
Name: <input type="text" name="name"  /><br />
Age: &nbsp&nbsp <input type="text" name="age"  /><br /><br />

<input type="radio" name="sex" value="Male" /> Male<br />
<input type="radio" name="sex" value="Female" /> Female<br /><br />

<strong>Interests:</strong><br />
<input type="checkbox" name="sports"  /> Sports<br />
<input type="checkbox" name="videogames"  /> Video Games<br />
<input type="checkbox" name="televisionmovies"  /> Television/Movies<br />
<input type="checkbox" name="webdesign" /> Web Design<br />
<input type="checkbox" name="programming" /> Programming<br />
<input type="checkbox" name="other" /> Other<br /><br />

<strong>Favourite Comic Book:</strong><br />
<select name="comicList">
<option value="" >Comic Books</option>
</select>

<input type="button" name="Submit" value="Submit" onclick="doStuff(document.myForm)" /><br /><br /><br />

<textarea rows="15" cols="50" name="ouputResults" readonly></textarea>

</form>

</body>
</html>

One of the main things I am having a problem with is getting the drop down menu to load the items from the array, instead of having them already listed within the form. I tried using this tutorial to get it to work, but so far I haven't been able to resolve whatever the problem seems to be.

If anyone can give me some help or some pointers, or point me in the right direction for what I'm doing wrong, I'd really appreciate it!

Thread: Help with simple JavaScript page for school?

Thread Tools

Search Thread

Help with simple JavaScript page for school?

Bookmarks

Bookmarks

Posting Permissions