/    Sign up×
Community /Pin to ProfileBookmark

Getting values of dynamically-named pulldown menus

Hi

I’m a longtime java coder but javascript newbie. got a quick problem i hope someone can hekp with. I am creating a number of pulldown menus, the names of which are created on-the-fly:

[CODE]
for (i = 0; i < outcomes.length; i++) {

for (j = 0; j < factors.length; j++) {
document.write (‘<td> <select id=”s’ + i + ‘s’ + j + ‘” name=”n’ + i + ‘s’ + j + ‘” size=1><option value=”0″>&nbsp;</option><option value=”5″>Highly Desirable</option>…</select></td> ‘);
}
}
[/CODE]

so basically, if the user has previously chosen to have 3 outcomes and 2 factors, the code above will produce pulldown menus with id’s of s0s0, s0s1, s0s2, s1s0, s1s1, s1s2. As you can see, if the outcome and factor arrays are different lengths, different numbers of pulldown menus will be created.

so – the problem is this. how do i determine what value the user has chosen for a specific pulldown menu? i understand i could write something like this:

[CODE]
document.NavForm.s0s0.options [document.NavForm.s0s0.selectedIndex].value;
[/CODE]

to get the value of pulldown menu s0s0. BUT this hardwires the name of the pulldown menu. i won’t know beforehand how many pulldown menus the user has (as they are rendered dynamically) – so i won’t know, for instance, if there is a pulldown menu s3s4. I’ve tried code along these lines, creating a multi-dimensional array then using a for loop to access values thus:

[CODE]
row0dropDowns = [‘s0-s0′,’s0-s1′,’s0-s2′,’s0-s3′,’s0-s4′,’s0-s5′,’s0-s6’];
row1dropDowns = [‘s1-s0′,’s1-s1′,’s1-s2′,’s1-s3′,’s1-s4′,’s1-s5′,’s1-s6’];

columnDropDowns = [row0dropDowns, row1dropDowns, …];

document.all[columnDropDowns[m][m]].options[document.all[columnDropDowns[m][m]].selectedIndex].value;
[/CODE]

but this gives the error ‘columnDropDowns is null or not an object’ or similar.

so – the big question – how do i access the values of pulldown menus which i have created – and thus named – on the fly? any help gratefully received, and also, if you need any clarification, let me know.

andy

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@FangFeb 05.2006 — var f=document.NavForm;
var aSelect=document.getElementsByTagName('select');
for(var i=0; i&lt;aSelect.length; i++) {
doSomethingWith(f.aSelect[i].options [f.aSelect[i].selectedIndex].value);
}
Copy linkTweet thisAlerts:
@toguraauthorFeb 05.2006 — excellent, thanks Fang. as i understand it this will only work if there are no other SELECT objects in the page. this isn't a problem for me though, so i'll be using your solution.

cheers,

andy
Copy linkTweet thisAlerts:
@SelrachFeb 05.2006 — Just for your knowledge, you can also narrow it down to a particular form if you need to by accessing that form and then use the getElementsByTagName function....aka
[CODE]var aSelect = document.NavForm1.getElementsByTagName('select');[/CODE]
Notice that you can use the function on any object that can also be considered the top node in the DOM.
×

Success!

Help @togura spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.21,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...