My ASP trip: Two-level linkage menu production

Menu | Linkage Menu

This problem is actually quite old, but as I have just learned ASP3 months, it is necessary to write down to strengthen their basic knowledge.

Take the most commonly used "provincial and municipal Drop-down list linkage" as an example!

In our production of Web site membership registration information, usually involves filling in their own province/city, if the input or textarea made to fill out the form is not ideal. So most of the sites will choose to link down the form of the list, do not calculate very complex, at the same time it looks very relaxed.

The following are specific practices:

1. Design Database

We use an Access database. First, create a new Access database named Database1.mdb

In the Database1.mdb database, two tables were established for province and city. The specific fields are designed as follows:

Province (province)

Specific fields: id-automatic numbering provincename-province name provinceno-province name Number provinceorder-province sort number

Province

ID	Provincename	Provinceno	Provinceorder
1	Beijing	0	0
2	Anhui Province	1	1
3	Shandong Province	2	2
4	Jiangsu Province	3	3

The following province name is abbreviated.

Design idea: ID is the automatic number of the table, Provincename and Provinceno is necessary, the former is used to store the name of the province, the latter is the necessary field of Contact table City. As for the Provinceorder is used to order the name of the province, control the Drop-down list of the location of the province name, you can omit.

City (cities)

Specific fields: id-AutoNumber cityname-city name cityno-City name Number cityorder-City sort number provinceid-province number

City

Id	CityName	Cityno	Cityorder	Provinceid
1	Beijing	1	1	0
2	Hefei city	2	2	1
3	Wuhu city	3	3	1
4	Anqing city	4	4	1
5	Jinan city	5	5	2
6	Qingdao	6	6	2

The following city name is slightly.

Design idea: The previous four with province table design idea, Provinceid field will province table and city table.

2. Design style and Coding

Two-level linkage style is very simple, in the Dreamweaver 2004 to the design page placed two select Drop-down menu, respectively named Province_select, City_select, they are in the form named Form1.

The encoding requires HTML, VBScript, and JavaScript. The first is to connect the database, we use the common <!--#include file= "conn.asp"--> connection. The code in conn.asp is slightly.

Second, using JavaScript and VBScript to read data from province and city tables and connect Province_select with City_select, this step is the key to the whole process.
The code is as follows:

<script language=javascript>
<%
Dim sql,i,j
'//////////////////////////read out the province table//////////////////////////
Set Rs_province=server.createobject ("Adodb.recordset")
Sql= "SELECT * from Province order by Provinceorder"
Rs_province.open sql,conn,1,1
%>

var selects=[];
selects[' xxx ']=new Array (new option (' Please select City ... ', ' xxx '));

         <%
         For I=1 to Rs_s.recordcount
        %>
          

        selects[' <%=rs_province ("Provinceno")%> ']=new Array (
        <%
        '//////////////// read out the  city table//////////////////////////
        set Rs_ City=server.createobject ("Adodb.recordset")
        sql= "select * from City where provinceid= "&rs_province" ("id") & "ORDER by Provinceorder"
         Rs_city.open sql,conn,1,1
        if rs_city.recordcount>0 Then
           for J=1 to Rs_city.recordcount
               if J=rs_city.recordcount then
        %>
      

New Option (' <%=trim (rs_city ("CityName"))%> ', ' <%=trim (rs_city ("Cityno")));

<%else%>

New Option (' <%=trim (rs_city ("CityName"))%> ', ' <%=trim (rs_city ("Cityno"))%> '),

<%
End If
Rs_city.movenext
Next
Else
%>
New Option (', ' 0 '));

        <%
        End If
        rs_city.close
        set Rs_ City=nothing
        Rs_province.movenext
         Next
        rs_province.close
         set rs_province=nothing
      %>
 

<!--//////////javascript Control linkage///////////-->
function Chsel () {
With (Document.form1) {
if (Province_select.value) {
city_select.options.length=0;
for (Var i=0;i<selects[province_select.value].length;i++) {
City_select.add (Selects[province_select.value][i]);
}
}
}
}

</script>

Finally, combining Html,javascript and VBScript to achieve the linkage effect. The code is as follows:

<!--//////////////////////////province_select Drop-down list//////////////////////////-->
<select name= "Province_select" Onchange=chsel () >
<option value= "xxx" selected> Please select the province ......</option>
<%
Dim Tmpid ' defines a temporary variable to remember the province ID
Tmpid=0

Set Rs_province=server. CreateObject ("Adodb.recordset")
Sql= "SELECT * from Province order by Provinceorder"
Rs_province.open sql,conn,1,1
While not rs_province.eof
Tmpid=rs_province ("id")
%>
<option value= "<%=rs_province (" Provinceno ")%>" ><%=trim (rs_province ("Provincename"))%></ Option>
<%
Rs_province.movenext
Wend
Rs_province.close
Set rs_province=nothing
%>
</select>

<!--//////////////////////////city_select Drop-down list//////////////////////////-->
<select name= "City_select" >
<%
Set Rs_city=server.createobject ("Adodb.recordset")
Sql= "SELECT * from city where provinceid=" &tmpid& "ORDER by Cityorder"
Rs_city.open sql,conn,1,1
While not rs_city.eof
%>
<option value= "<%=rs_city (" Cityno ")%>" ><%=trim (rs_city ("CityName"))%></option>
<%
Rs_city.movenext
Wend
Rs_city.close
Set rs_city=nothing
%>
</select>

So far, a provincial and municipal two-level linkage menu program will be written. Although the code is not much, but the reflection of the technology is relatively comprehensive. Hope to learn a little more knowledge, write a better dongdong ^_^