Javascript to set value of another field based on select choice

If you have a form with a select box, and you want to capture a 2nd value from what the user selects (besides just the value alone), here's how to do it.

Your form looks like this:

<form name="devin">

<select name='BeginDate2' value='BeginDate2>

<option id ='xxx'>Colorado</option>

<option id ='yyy'>Washington</option>

</select>

<input type="submit" value="Run Report"></form>

You want to capture both the value (Colorado) and the ID (xxx).

STEP 1 - Put this Javascript in your web page.

<script language="javascript">

function getid()

{

var r = document.devin.BeginDate2.selectedIndex;

var id = document.devin.BeginDate2.options[r].id;

document.devin.first.value = document.devin.BeginDate2.options[r].id;

}

</script>

STEP 2 - Add this code to your form:

<input name="first" id="first" value=""/>

If you want it to be hidden to the user, you this version:

<input name="first" id="first" type="hidden" value=""/>

STEP 3 - Add this code to your form

onchange='getid()'

STEP 4 - Your final form should look like:

<form name="devin">

<input name="first" id="first" type="hidden" value=""/>

<select onchange='getid()' name='BeginDate2' value='BeginDate2>

<option id ='xxx'>Colorado</option>

<option id ='yyy'>Washington</option>

</select>

<input type="submit" value="Run Report"></form>