In this tutorial topic you will learn how to display all the continent names in a drop-down menu, and with the click of a button, see the countries from the selected continent.
We'll keep working in the index To index a list is to arrange it in a certain order (alphabetically, most common), in order to easily find its elements. page. Let's create the recordset A recordset is the result of executing an SQL query. It is composed of multiple rows, each row having multiple columns. The columns presented in the query result depend on the column list declared in the query (they can belong to different tables). The number of rows and their order depend on the query conditions (WHERE, GROUP BY, HAVING, ORDER). The recordset acts as a source of dynamic data in web applications. that retrieves all the continent names, and that will be used to populate the drop-down menu options. Go to the Application panel, Bindings -> + -> Recordset (Query A query is a SQL command that will extract information from the tables of a database. Essentially, a query is a request for information from your database.) and configure the window that opens as shown below:
Name the recordset rsContinents.
Select the conn_categ_menu database A database refers to data organized and stored on a computer that can be searched and retrieved by a computer program. Most industrial-strength and many smaller database applications can be addressed using SQL (Structured Query Language). connection defined earlier.
Select the continent_con database table.
Since there are only two columns, select them all (although the name_con would suffice).
Sort the records ascending, by the name_con column so that they will be displayed in alphabetical order in the drop-down menu (making it easier to find the needed option).
You can press the Test button and see the retrieved data.
Click OK to create the recordset.
Place the mouse cursor at the end of the page (press the right arrow to make sure), and then create a new paragraph by pressing Enter. Add a List/Menu control from the Forms tab of the Insert bar. If you are working in Dreamweaver 8, the following window will pop-up:
Enter "Select continent:" in the Label text box and leave the other settings at their default values. Click OK to insert the list/menu element. Select it in Dreamweaver's Design View (single click) and change its name in the Property Inspector to KT_continent_con:
Note: As you can notice, the name of this form control is made out of two particles: "KT_" and the name of the database table where the categories to be displayed in the list/menu are stored. So when you perform these operations and use other database tables, do not forget to update the name of the form control.
In the same form, next to the list/menu element, add a button from the Forms tab of the Insert bar. When the Input Tag Accessibility Attributes pops-up, just click Cancel. Change the button label to Go (the Value text box in the Property Inspector), and delete the default name given to the button (Submit) so to avoid any potential conflicts.
Select the form that includes the list/menu and the button (click the <form#form1> tag in the Tag Selector) and in the Property Inspector, select the GET method.
The list/menu control is the drop-down menu that will display the continents in browser. So let's make it a dynamic menu that retrieves data from the rsContinents recordset. With the list/menu selected, click the Dynamic button in the Property Inspector (as shown in the image above). A dialog box will pop-up:
In the Options from recordset drop-down menu select rsContinents.
In the Values drop-down menu select the name_con column (NOT the id_con one, as the value is retrieved from the name).
In the Labels drop-down menu also select the name_con column.
When configuring the Select value equal to text box, click the lighting bolt on the right. The Dynamic Data window will show.
Select the KT_continent_con URL parameter.
The Code text box in the lower part of the interface will be automatically populated.
Note: For the PHP server model Server model is the Dreamweaver term for your combination of the scripting language and/ or database software used for development on your server, for instance PHP_MySQL, ASP.NET, ASP VBScript, ColdFusion, etc. InterAKT extensions generate server side code. Therefore, setting the correct server model in your site definition is important so that extensions generate the proper code for your development framework., before the "$" character, type "@" so that when possible errors are encountered, they will be invisibly handled.
Click OK to close the Dynamic Data window.
Click OK to add dynamic values to the list/menu control.
With this, you achieved the goal of this 'how to' tutorial. At this point, the index page in Dreamweaver should look like below:
Save it, upload it and preview it in the browser (by pressing the F12 key):
Select a continent in the drop-down menu, click the "Go" button, and you will see the associated countries displayed in the dynamic table: