accessing dynamic JS generated dropdown list option values

[thepeskykid]

hello,

can i use:

var selectedOption = document.formName.selectName.options[document.formName.selectName.selectedIndex].value;

... to select the values of the options in a dropdown list, if this dropdown list has been generated dynamically through a previous JS function

eg webpage psuedo code;

JS - function 1: adds a new item to dropdown list when button A clicked
JS - function 2: alert displaying selected option when option is selected and button B clicked
html - form called formName
dropdown list called selectName (with no hard coded options)

I have written the above and everything works fine except that:

var selectedOption = document.formName.selectName.options[document.formName.selectName.selectedIndex].value;

... the alert box displays nothing!?

Is this because the dropdown list is 'virtual' as opposed to hard coded html?

I need the dropdown list to grow as the user adds items and I need other functions to be able to 'know' what option the user has selected - I am confused

Can anyone point me in the right direction?

:)

[cheesebagpipe]

pesky -

To get a non-'pseudo' answer, post what actually doesn't work so people can see it directly. :)

btw, you're alerting the .value - if your alert box is 'empty' rather than erroring, maybe you forgot to set the new Option's value....

[thepeskykid]

point taken :)

the form and the dropdown list are hard coded into the same webpage as the following functions

the references to mainArray simply refer to an array that stores other arrays of debt data (a two dimensional array)

the following function is used to dynamically add a new option to the hardcoded option list

function setOptionText()
{
if (mainArray.length == 0)
{
// put No Selection at the top of the list
var newOption = new Option("No Selection");
document.debt_list.debt_selector.options[0] = newOption;
}
else
{
// first clear existing options
for (i=0; i < document.debt_list.debt_selector.options.length; i++)
{
document.debt_list.debt_selector.options[i] = null;
}
// then populate form select with required options
for (i=0; i < mainArray.length; i++)
{
var newOption = new Option(i+1);
document.debt_list.debt_selector.options[i] = newOption;
}
}
}

the following function takes the selected option number, uses this number to extract the required debt data from mainArray and displays it in the form fields (that the user uses to input debt information)...

function edit_existing_debt()
{
// get the value of the selected debt

// To Do: following line not extracting value
var selected_debt = document.debt_list.debt_selector.options[document.debt_list.debt_selector.selectedIndex].value;

// following alerts for debug
alert(selected_debt); // alert displays nothing (causing later mainArray error)
alert(mainArray); // displays contents of mainArray as expected

// store the selected debt array values in vars
var debt_name = mainArray[selected_debt][1]; // mainArray ref fails as selected_debt appears to be null
var tot_bal = mainArray[selected_debt][2];
var mon_pay = mainArray[selected_debt][3];
var div_ans = mainArray[selected_debt][4];
var po_pri = mainArray[selected_debt][5];
var mar_rol = mainArray[selected_debt][6];
var m2po = mainArray[selected_debt][7];
// display each debt array value in the input fields
document.debt_list.debt_name.value = debt_name;
document.debt_list.tot_bal.value = tot_bal;
document.debt_list.mon_pay.value = mon_pay;
document.debt_list.div_ans.value = div_ans;
document.debt_list.po_pri.value = po_pri;
document.debt_list.mar_rol.value = mar_rol;
document.debt_list.m2po.value = m2po;
// set selected debt array to "edit"
}

i hope this gives people enough to help me sort this problem out

thank you

[cheesebagpipe]

The Option() constructor takes up to four arguments, the first two of which are the key ones: Option.text and Option.value. This:

var newOption = new Option(i+1);

...appears to be setting just the displayed text, leaving the value an empty string, which gives an 'empty' alert box.

http://webreference.com/js/tips/000118.html

[thepeskykid]

thank you cheesebagpipe