JavaScript + PHP Application 1: Dynamic implementation of double drop-down menus in web page production
--- Excerpted from the Internet
In web page production, we often encounter this situation. Through the selection of the main drop-down menu, a sub-drop-down menu is dynamically generated. For example: There are three options in the main menu: "Focus News", "Lifestyle", and "Mood Stories". By selecting "Focus News", submenus are automatically generated such as "Domestic", "International", "Sports", "Entertainment", and so on.
Using javascript, we can easily achieve the above effects. But the problem is that if the options in the menu are dynamically extracted from a database (or other file), it is not easy to implement. Based on my own practical experience, the author introduces to you an implementation method using javascript + php. The database in this article uses mysql. In this example, the author will also introduce how to return to the previous selection state of the menu option after each form submission.
The function of php introduced in the article is to extract menu options from the database, and the other function is to generate javascript code. Readers can use their own familiar interpreted language, such as asp.
In order to simplify the code, the author assumes that the main menu has been constructed through HTML. Since the submenu requires dynamic design, only the basic frame is drawn. The HTML code is as follows:
What we need to consider is what steps need to be completed for the menu's onchange() event. The general process is to construct submenu items based on the main menu options. It is best to set the item text of the submenu in advance. Based on this idea, the author uses a joint array in JavaScript to record the submenu options, and it is automatically generated by PHP when loading. Therefore, the author designed the following javascript function setmenu():
function setmenu(){
menu=array("a","b","c"); //Construct menu union array
$db = new my_db();
$db->database = "***"; //Construct a new mysql connection, phplib is used here
$mmenu = array("a","b","c"); //The author has simplified it here
for ($i=0;$i
$db->query("select menu from class where menuid ='".$id."'");