Convert HTML JavaScript link to form component

As I see you need just Javascript to work. onchange you call JS function changer()

Two ways:

<select name="state">
<option value="onchange(changer('Arizona'))">Arizona</select>
</select>

<select name="state">
<option value="onchange(changer(this))">Arizona</select>
</select>

ASKER

te-edu's are what I'm looking for, though I tried both of his formats and neither seem to work. Basically these functional links run the script "changer" so when I hover over them, it reads:

Run script "changer('Arizona')"

Also I think the </select> tag should be </option> unless I'm totally mistaken.

ASKER

Basically this code below works when I click on a state, the respective cities show up (so if I click on Arkansas I get Little Rock, Conway, Benton, etc.)

<a href="javascript:changer('Arkansas')">Arkansas</a> |
<a href="javascript:changer('California')">California</a> |
<a href="javascript:changer('Florida')">Florida</a> |
<a href="javascript:changer('New York')">New York</a>

But I want it in a drop down menu and not listed out as hyperlinks.

The name of the form is "theForm" and the name of the select is "theState", but for some reason I can't get it to function properly. Any ideas?

<select name="theState" OnChange="javascript:changer(theForm.theState.options[selectedIndex].value)">
<option selected>Please Select a State</option>
<option value="javascript:changer('Florida')">Florida</option>
</select>

This can't be too difficult. This works as an HTML link, I just need it to function inside a dropdown menu as opposed to a text link.

My mistake

<select name="state" onchange(changer(this)) >
<option value="Arizona">Arizona</select>
</select>

Javascript

function changer(el){
alert(el);
}

ASKER

Ok, this still isn't working. Here's my code...

<script type="text/javascript" src="dynamicDropDown.js"></script>
<script type="text/javascript">
function changer(el){
alert(el);
}
</script>

<select name="theState" onchange(changer(this)) >
<option value="">--Select a State--</option>
<option value="Florida">Florida</option>
<option value="California">California</option>
</select>

Working 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>Untitled Document</title>
<script type="text/javascript">
function changer(selectObj){
	 var idx = selectObj.selectedIndex; 
 // get the value of the selected option 
 var which = selectObj.options[idx].value; 

alert(which);
}


</script>
</head>

<body>

<select name="state"  onchange="changer(this)">
<option value="Arizona" >Arizona</option>
<option value="California">California</option>

</select>



</body>
</html>

or this both working

<!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>Untitled Document</title>
<script type="text/javascript">
function changer(selectObj){

alert(selectObj);
}


</script>
</head>

<body>

<select name="state"  onchange="changer(this.options[selectedIndex].value)">
<option value="Arizona" >Arizona</option>
<option value="California">California</option>

</select>



</body>
</html>

ASKER CERTIFIED SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial