PDA

View Full Version : Chained Menu not Populating Tertiary Dropdown



jasonv
09-26-2010, 04:27 PM
1) Script Title: chainedmenu.zip

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...hainedmenu.zip

3) Describe problem: A third option menu won't populate

Hello,

This may have been resolved in another thread, but I can't see where the responses may have resolved the issue if they were sent as emails or something. I have an already edited version of the config.js file that a previous webmaster used for a site that I have taken on as manager. I am attempting to get his current script to populate a third field to display times available for a registration form.

Here is a current sample of the JS -


addListGroup("reservations", "month");

addOption("month", "Select a Month", "", 1); //HEADER OPTION
addList("month", "August", "", "August");
addList("month", "September", "", "September");
addList("month", "October", "", "October");

addOption("August", "Select a Date", "", 1); //HEADER OPTION
addList("August", "14 (Sat)", "14", "aug-14");
addList("August", "21 (Sat)", "21", "");
addList("August", "28 (Sat)", "28", "");//END OF THIS NODE

addOption("aug-14", "Select a Time", "", 1);//HEADER OPTION
addList("aug-14", "9:00am", "9:00am", "");
addList("aug-14", "10:00am", "10:00am", "");


And here is a current example of the form areas needing to be populated -

<tr>
<td align="right">Month:</td>
<td align="left"><select name="month" style="width:130px;">
</select></td>
</tr>
<tr>
<td align="right">Day:</td>
<td align="left"><select name="day" style="width:110px;">
</select></td>
</tr>
<tr>
<td align="right">Arrival Time:</td>
<td align="left"><select name="time" style="width:110px;"></select></td>
</tr>

It works up till choosing a date, but when I attempt to get the time option to drop to the next select menu, nothing happens. I have line-by-line compared his chainedmenu.js file and there are no differences in what he has edited to possibly stop it from populating any further than the 2nd select menu.

Here is a link to see the current status of the issue -
http://harvestfarm.net/PREVIEW/test/...tions_test.php

Thanks for your help and if it there is another post on the forum that has a resolution for this you can point me in that direction and I will take it from there.

ddadmin
09-27-2010, 04:04 AM
Please edit the link at the bottom of your post again, as it's currently truncated/ broken.

jasonv
09-28-2010, 04:45 PM
The link truncates automatically when I past it...

http://www.harvestfarm.net/PREVIEW/test/fall_festival/reservations_test.php

does that work?

jasonv
09-28-2010, 10:41 PM
How bout now?

http://www.harvestfarm.net/PREVIEW/test/fall_festival/reservations_test.php

ddadmin
09-30-2010, 12:28 AM
Sorry for the delay in response, too me a while to finally wrap my head around the syntax used in this script- multi dimensional things was never my strong suit. Anyhow, having dissected your code, I believe I see the issue now. Firstly, in the BODY tag of your page, you forgot to register the name of the 3rd SELECT menu (so the script is aware of its existence):


<body onload="initListGroup('reservations', document.forms[0].month, document.forms[0].day, document.forms[0].time)" bgcolor="#ffcc00">

The code in red is new and should be added in. At the same time, for your 3rd SELECT menu, change its name to "time" to reflect what was registered above:


<select gtbfieldid="3" name="time" style="width: 110px;"></select>

Having fixed the above, there are also a number of problems with your configuration code (select_time.js). In a nutshell, you're calling addList() in a lot of places where you should be invoking addOption() instead. Make a copy of your original select_time.js first, then replace it temporarily with the following instead to see how the basic syntax should work:


var hide_empty_list=false;

addListGroup("reservations", "month");

addOption("month", "Select a Month", "", 1); //HEADER OPTION
addList("month", "August", "", "August");
addList("month", "September", "", "September");
addList("month", "October", "", "October");

addOption("August", "Select a Date", "", 1); //HEADER OPTION
addList("August", "14 (Sat)", "14", "aug-14");
addOption("August", "21 (Sat)", "21", "");
addOption("August", "28 (Sat)", "28", "");//END OF THIS NODE

addOption("aug-14", "Select a Time", "", 1);//HEADER OPTION
addOption("aug-14", "9:00am", "9:00am", "");
addOption("aug-14", "10:00am", "10:00am", "");

The above works all the way up to the 3rd select menu for the selection "August" -> "14 (Sat)" -> Some time.

jasonv
09-30-2010, 07:45 PM
Hey Thanks! I will try this out. Sorry for the other post, I think I hit a wrong button or something. You can close that one out. Sorry again!