Add a navigation bar for continent categories

In this tutorial topic you will use the Category Navigation Bar Wizard to create a dynamic table that lists countries from the same continent. The continent is selected in the category navigation bar A set of graphical or textual buttons containing hyperlinks to pages that are part of the same web structure. Sometimes shortened to "Navbar", it allows users to browse back and forth through a group of records, or allow to view items associated with a selected category or letter/character., also added by the wizard.

First of all, after opening 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, create a 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 the category items, namely the countries. 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:

 

  1. Name the recordset rsCountries.

  2. 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.

  3. Select the country_cnt database table.

  4. Select only two of the database columns, namely name_cnt and capital_cnt (this is the information that will be displayed in browser).

  5. Sort the records ascending, by the name_cnt column so that they will be displayed in alphabetical order.

  6. You can press the Test button and see the retrieved data.

  7. Click OK to create the recordset.

 

To create the country/capital list (dynamic table A dynamic table is an ordinary HTML table which contains dynamic content (usually within a Repeat Region). Its number of rows changes according to the number of records retrieved from the database.) and the category (continents) navigation bar, place the cursor in the index page (the <body> tag) and apply the Category Navigation Bar Wizard from the InterAKT tab of the Insert bar. The wizard has two steps. Configure them as shown below:

 

  1. Select the conn_categ_menu database connection previously defined.

  2. Select the rsCountries recordset that retrieves the category items, meaning the countries.

  3. For the items table, select the country_cnt one.

  4. As the foreign key A foreign key is a field from a database table that refers to (or targets) a specific key, usually the primary key, in another table. This is a convenient way of logically linking information from related tables in the same database. For instance, a table that stores information about products can contain a foreign key that references the primary key field in a table that stores manufacturers. This way, each product has an associated manufacturer – its associated foreign key points to the unique identifier of the manufacturer. Please note that the foreign key is not unique, but the referenced field (the primary key in the referenced table) usually is., select the idcon_cnt table column that links each country to the continent it belongs to.

  5. Select the continent_con table as the category one.

  6. Select the primary key A primary key is one or more table columns whose values uniquely identify each record in a table. In general, a primary key is defined on a single column, but it is not uncommon to have it defined on two columns. of the continents table, namely id_con.

  7. Select the name_con column to be displayed in the category navigation bar.

  8. Click Next to move on to the second step of the wizard.

 

 

  1. Let's display all the continent names at once, so select to navigate by using Category labels.

  2. Choose the Aqua skin In web development, skins are custom graphical appearances that can be applied to certain websites in order to suit the different tastes of different users. Such websites are referred to as being skinnable, and the process of writing or applying such a skin is known as skinning. Applying a skin changes a website's look and feel - some skins merely make the website more aesthetically pleasing, but others can rearrange elements of the interface. for all the site.

  3. Show the empty categories (continents) as text.

  4. Click Finish when you are done configuring the wizard.

 

Change the title of the first column in the dynamic table to Country.

At this point, the index page in Dreamweaver should look like below:

 

To see how the page looks in browser, save, upload and preview it (by pressing the F12 key):