Hi, I'm building a page with conditional value lists loaded into Javascript arrays and I'm stuck!!

on the page below I've loaded some of the arrays and this was going OK until I've reached the second level.

In my example, if you choose "The Grocer" and then choose " the grocer display" it works OK, but not if you choose "the grocer recruitment". If I comment out the "If" statement for "the grocer display", the "recruitment" choice starts working.

Apologies for getting rather OT here, but can someone point me to the errors in my JavaScript please??

http://www.william-reed.net/adsizes8.htm

thanks, jeff

Hey Jeff!

JS is not my strong side...perhaps a quick link will help:

http://webreference.com/dev/menus/

look inder 2D-3D Open Source section

Good Luck!

Hi, It's not my strong side either, which is why it doesn't work -(

........ but I figured there are guys around here who are good at this stuff!

thanks for the tip, I'll have a look, jeff

Hi Jeff, I've made a few adjustments your script so that it works. You can view the updated code at http://mariano.petersonpages.com/demo/javascript/dynamicLists.htm

The original problem was caused by a dangling if statement somewhere in your code. I tried to format the code (indent if and for blocks, etc) in my code editor (Homesite), and had trouble matching open/close brackets. Anyway, I'm fairly sure that is where the problem was.

I've also written another version of the code which is easier to read and maintain, and also more extensible: http://mariano.petersonpages.com/demo/javascript/dynamicLists_improved.htm

This version assigns values attributes to each select option, which makes the code more manageable. Option values are useful because they allow you to easily change the visible text for an option without having to rewrite code in other places -- just be sure that your surrounding code works with the value attributes of the select list and not the text.

I also reduced the function calls in the HTML body to just one parameter, "this.form". This is easier to read and provides a relative path to the form which will work even if the form name changes at a future date. I moved the functionality of obtaining a reference to the select list inside the function, instead of the inside the function call. This helps encapsulate the code more, which helps reduce bugs. Also, if the function ever needs to change the select lists it acts upon, you only have to change code in one place, instead of through out your HTML code

Since there were multiple places where select lists were being re-populated, I created a new function which encapsulates this functionality. This removed a lot of tedious code from the main logic functions, which made them easier to read. Also, if you ever need to re-populate a select list anywhere else you have a handy function ready to go.

Hope this helps!

Hey thanks for the link Leb i Sol, that is very useful!

Hi Mariano!

No problem it was one of those 'favorites' that never got read or used....I also struggeled with the IF and ELSE IF attempt and had no luck...

Mariano & Jeff

Note:

>if user decides to go for "the Grocer" --> "The Grocer Display" the user will get LOCKED into this selection and can not change his mind eg. going for "The Groceer Recruit"......and ever a page refresh will not fix it- only full URL relaod will....

My stupid suggestion to quick & dirty fix [reset] button or for more "sophisticated" approach an option in "child menu" to re-set pert to 1 step back.....but I don't know the whole picture so maybe there is more to this.

Take care!

oops just saw it, Mariano already wrote a reset function it jsut didn't fire.....

Awesome!

Thanks guys, I was getting really lost here because the original brief called for just TWO levels (publication > size) and then at the last minute someone remembered that sizes varied according to section.

I guess it was my own fault for trying to add a bit instead of starting again and I got really lost.

Thanks again for your expert help

regards, jeff

PS - I'm definitely going to use the "improved" version. "Case" is just a much more elegant way of dealing with this and very easy to add to .