30 / 03 / 2017

Usuarios conectados: 5

Cargando documento...



Este Sitio:













Mailing List:

Suscríbete a la lista de correo, No practico spamming y ofrece algunas ventajas.

Pulsa aquí para saber más y suscribirte.



Tecnorama >Dreamweaver Extensions


Dynamic Dependant Dropdown Menus

Versión para imprimir | Translate this page

PHP/MySQL,ASP-VBScript,ASP-JavaScript and JSP Server Models . Dreamweaver MX, MX2004, DW8, DW CS3, DW CS4, CS5 and DW CS5.5 compatible

With this extension you can build up to five dependant dropdown menu lists (that is, collection of menu lists where every menu data changes filtered by its parent menus' selected values without reloading the page).

I'll give you an example: You want to build 3 menu lists to select a book, where:

  • Menu 1 displays availables genres.
  • Menu 2 displays authors for the selected genre.
  • Menu 3 displays books by the author selected in menu 2, but only those matching the genre in menu 1.

See the Demo Series->

Sometimes,this system can be more helpful than using a search form with multiple options. For example:
If someone makes a search in a database looking for Sci-Fi books written by Shakespeare the result should be 0 records.

With multiple dependant menus, as soon as the user selects "Sci-Fi" in the "genre" menu, Sir William won't appear in the authors' list. It could aslo happen that your shop sells novels by Isaac Asimov but doesn't have his essay books. With this menus, Mr Asimov won't be displayed if the user selects "essay" in the "genre" menu, but will be in the authors' list for "novel".

The main Features are:

  • Lightweight: The code is only 3 kb
  • Works with 99.9% of browsers: It can even work with Netscape 4.03!
  • Allows multiple selections.
  • Can mark as selected by default any dynamic value.
  • You can keep any predefinided value of your choice.
  • It can work even without table relationships: you can build up to 5 menus with data from just one simple table
  • Menus can be manipulated in DW: their appearance remains transparent to DW's Property Inspector and even more behaviors can be added to them
  • Works with most Server models: It gives support for ASP(VB and JS), PHP/MySQL, PHP ADODB, JSP and ColdFusion.
    If you are using ASP.NET, Kevin Marshall at WebXel has the anwser.
  • It is compatible with DW MX and DW MX2004

Now, let's see how it all works.
The menus use data from a DB that could be like this:

  • Table "genres":
    • -id_genre
    • -genre
  • Table "authors":
    • -id_author
    • -author
  • Table "books":
    • -id_book
    • -id_genre (foreign key)
    • -id_author (foreign key)
    • -book

To display a list of all books with their genre and author's name, the query could be:
SELECT books.book,books.id_book,books.id_author,books.id_genre,authors.author,genres.genre
FROM tbl_books,tbl_authors,tbl_genres
genre ,author,book


This query returns something like:

As you can see, it's quite a common query and looks exacty like those you can use to build a repeat region.

Well, this is all you need to build the three menus! Let's see the steps:

1-Add a form, if you haven't one in your document, and place the cursor where you want the menus to be added

2- Select the PHP/ASP/JSP tab and click the icon in the image.

You will see this window:

3.- Select the Recordset that contains your query from the list at the top.

4- In the column "List/Menu names" add the names you wish for the menus (they will be the values used for the "name" attribute in the <select> tag). They must be in hierarchical order. In our example, the order is "genre,author,book" (if you wanted to filter by author first, because he has books of different genres, the order woul be "author, genre, book").
Let's add them and leave fields #4 and #5 blank.:

5- Now let's concentrate on the other two columns: In them, we'll select the name/value pair for every menu.
For example: the menu "genre" will have the values "genre" and "id_genre".
Don't worry about the values for the empty fields.

When you finish steps #4 and #5, you will have something like this

6.- Defining Default Values:
Using a default value, you can define which element in the menus should be marked as selected when the page loads. You don't need to define a "default value" for every menu, most of the times only one is needed. For example, if you define a default value for the Books menu, matching an URL parameter, the code is wise enough to guess which genre and author the book is related to (note that in this example we've also added another menu to separate books and CD's and applied a style to the menus using the "Style" dropdown list in the extension window):

The menus, marking as selected the url param "item"

Now, the same menus showing another item:

7.- It's done. Click "OK" and you''ll see this:

7.- Now you can move them, apply a style or whatever you want, as long as you don't change their names, the function call attached to them (onLoad="TCN_reload(this)") and you leave the script code after the three menus.

8.- New in version 1.5.0: You can keep intact the predefined value: it won't be deleted when the menus are updated. Use it to display a title in the menus!!!See a demo of this feature>>

9.- New in version 1.7.0: The extension can manage menus allowing multiple selections.

10.- New in version 2.0.4 (Nov 7, 2011): Unlimited numbers of menus can be created. Edit mode

To remove it, simply delete the menus and the script.

See Demo Series with lots of samples!!>>>

Price: Eur. 7.50 (+-$9.00 USD). The pack includes the extension, a 19-page manual in PDF format, including some useful tips.

Comments? 230, so far. Displaying 46 ->50

46.- quote this lolshut up vaniga,clitoris!!!!!!!!!!shut up man,u fuck,i’m not american so i don’t understand that!!!!!!!!!!!the sounds of each person must be different,and the settings must be have novice,easy,normal,hard,impossible,btw what is “AI”???????????You, sir, are an idiot. “AI” is the computer. If there was no AI, you would just be sending out guys and attacking the base. There’d be no xp, or need for turrets. AI is the enemy team, the computer. Everybody knows that. im not american you penis. stop spaming and quoting what? plhio; WTF!!!so many quotes:)\Lets keep quoteing:)just keep quoteingjust \keep quoteingiwanna see wat happensI so wanna see what happens:)omg im so proud i started all this!LOL you guys are wrecking loussi’s websitewrold record here we comewwwwwwwwwoooooooowwwwwwww!!!!!!!!!!! holy crap!!!!!!LOL WORLD RECORD, POST MORE COMMENTS EVERYONE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!I constantly make many quotesI make another quote LONGEST QUOTE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! http://pleuxvswvb.com [url=http://autwoqlus.com]autwoqlus[/url] [link=http://fsofkqujjz.com]fsofkqujjz[/link]

47.- Sande -I just learned today about your new shop. Boy, I wish it was just a liltte bit closer. We miss you here in Williamsburg. Hope all is well.Peg

48.- 其實我所講的世界 其實是一個比喻 豪情的意思, 可以是不加思索, 沒有羈絆去做一件事..那一件事可以 超乎 你所想的..(所以我所說改變世界是沒有錯的, 英文歌都有得唱 )中國人的弊病就是 連想也不敢想 沒有想何來有動力可以 做 呢?看看你的blog所寫既例子 公民黨就是被現實的制爪(包括名利, 職位)而不能拋開身段, 結果甚麼都做不來 梁國雄優勝的地方就是 做左先 , 佢可以真正唔理現實上的制爪(例如法理上的不健全).最緊要的, 選擇 做 之後, 如果是 adversity 既話, 佢可以想法子去 應變 . 由弱轉強 .不拋開連做也不敢去做既話, 連應變也不懂 很多事沒有step 1, 那有step 2?其實以上講甚麼 勇氣 "熱情 "豪情 真是 train 出來的 梁國雄有咁既background, 全因他有 遊歷 , 冒險 既經驗 我有睇過雜誌 佢可以捱得窮, 都可以獨個到歐洲體驗生活, 在德國可以去媾鬼妹, 去法國從事農業工作 一個人在異方要獨立解決生活問題 這些就是這樣 train 出來.冒險家呢個字我從未在中國人裏面可以找出來 香港那些年青人 係他們可以有遊歷 但只不過是父母逼他們到外國做 二世祖 即係讀書 .

49.- A bit suresirpd it seems to simple and yet useful.

50.- Hi there gypsy goddess. Jeff and I went to a movie today and saw Amanda. She lokeod wonderful, as always, and told us about your new store being open. Congratulations. The website is amazing. I bet you had a great time opening up all your boxes of treasures and setting up your new store. What a great time you must be having. Enjoy our new adventure. Miss you. JanPS. Hello to sister kathyPSS. Can I take a basic wire class? :=}

Previous | 21 - 25 | 26 - 30 | 31 - 35 | 36 - 40 | 41 - 45 | 46 - 50 | 51 - 55 | 56 - 60 | 61 - 65 | 66 - 70 | Next

Add your Comments

Escribe el cdigo de la imagen superior:


TECNORAMA es simplemente una página personal. No sirve ni de promoción del autor ni cosas por el estilo.
Todos los cdigos, textos y tutoriales son de libre uso mientras se mencione al autor (no es mucho pedir)
Este sitio es compatible con IE6/NS6/Mozilla1.0
Para contactar, puedes enviarme un e-mail a tecnorama@hotmail.com