Hi Eric, I am also a newbe at using JavaScript. I've tried to figure out what is going on with your example, which I can see does work. Would you be so kind as to explain what happens with each loop of the cfoutput?
Thanks much, Lewis On Mon, Jul 26, 2010 at 2:14 PM, Eric Nicholas Sweeney < [email protected]> wrote: > > Here is what I do - based on: http://tutorial11.easycfm.com/ > > I store the Categories and Subcategories in the database and then query > them > to build the javascript. The real trick is getting the Query to get your > categories/selections correctly aligned. After that - the rest falls into > place. > > - Nick > > First - Query then setup the Javascript: > > <cfquery name="qryGetCats" datasource="#Application.DSN#"> > SELECT s.SubCatID, s.SubCatName, c.CatName, c.CatID > FROM WT_SubCategories s > INNER JOIN WT_Categories c ON s.CatID = c.CatID > ORDER BY CatName desc, SubCatName > </cfquery> > > <cfset idx = -1> > <cfset mycase = 0> > <!--- > The JavaScript is adapted from Mike Corbridge's Multiple dynamic > drop-down selection boxes example http://tutorial11.easycfm.com/ > ---> > <script language="JavaScript1.2"> > function whichCategory(obj){ > switch (obj.selectCategory.selectedIndex){ > <!--- use the group attribute to group output by > category ---> > <cfoutput query="qryGetCats" group="CatName"> > <cfset mycase = mycase + 1>case #mycase#: > <cfset myList = ValueList(qryGetCats.CatID)> > <cfset numberInCategory = ListValueCount(myList, CatID)> > > > obj.selectSubCat.length=#numberInCategory#<cfoutput><cfset idx = idx + 1> > > obj.selectSubCat.options[#idx#].value="#qryGetCats.SubCatID#" > > obj.selectSubCat.options[#idx#].text="#qryGetCats.SubCatName#"</cfoutput> > break; > > <cfset idx = -1> > </cfoutput> > } > } > </script> > > > And for the FORM I use this: > > <option value="">- Select Category -</option> > <!--- again, use the group attribute to group output by category > ---> > <cfoutput query="qryGetCats" group="CatName"> > <option value="#CatID#">#CatName#</option> > </cfoutput> > </select> > > <select name="selectSubCat" onchange="whichCategory(this.form)"> > <option value=""> <- First Select Category</option> > </select> > > > > ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~| Order the Adobe Coldfusion Anthology now! http://www.amazon.com/Adobe-Coldfusion-Anthology-Michael-Dinowitz/dp/1430272155/?tag=houseoffusion Archive: http://www.houseoffusion.com/groups/cf-newbie/message.cfm/messageid:5057 Subscription: http://www.houseoffusion.com/groups/cf-newbie/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/groups/cf-newbie/unsubscribe.cfm
