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
WHERE
tbl_books.id_genre=tbl_genres.id_genre
AND
tbl_books.id_author=tbl_authors.id_author
ORDER BY
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.

[Top]