Essence | Problems when developing a Web application, you often experience multiple levels of selection, that is, the optional information at the child level depends on the data selected at the parent level. For example, a Web page contains two select input controls, one for list alternatives ("parent" level selection) and another for List province information ("Child" level selection). When a user selects a country in the first select input control (the "parent" selection), the option to another select input control (the "Child" level selection) is changed to the state option of the corresponding country, and the relationship between them is dynamically stored in the database.
Ask a question
The traditional solution can be described as: the user selects the "parent" level selection, through the form submission, by the appropriate handler from the database to extract the "child" level of the selected information, and refresh the client page of the "Child" level of the selected data.
The disadvantage of adopting this approach is that:
One or more ASP programs must be written to handle the user's request separately, the program code quality is not high;
When the series is over two, it is necessary to solve the problem of saving the choice information at the "grandfather" level;
Every time the user's modification or browsing multi-level information, must be repeated to obtain multi-level information, so that increased the burden on the server, the response speed is slow.
In view of the problems existing in the above scheme, the author found a solution in practice. This method flexibly applies the input control object hidden in HTML language, when the amount of data in hidden is less than 2K, it can download multilevel information to the client at a time, and through the interaction of server-side script and client script, complete multilevel selection directly on the client.
Solving method
The input control object in HTML language hidden can store string data in a name-value way, and the control object is not visible on the client interface.
Using this input control, multilevel selection information in the database can be encoded according to certain rules and stored in multiple hidden objects. When the user clicks on the parent option, the client program locates the corresponding hidden object according to the corresponding relation, decodes the string information in the hidden object, and refreshes the child Selection object.
Among them, the server-side script needs to complete the work is the multi-level information in the database in order to extract, and the same level of information data according to a certain rule code to form a string, stored in a different hidden object, and the task that client script needs to do is to decode the string data in hidden object, and is displayed in the child Selection object.
It is important to note that the string encoding of the data is a key factor in the success of this method, so the encoding method must be guaranteed to be correct.
Concrete implementation
The following is an example of the two-level selection in the country and province, and introduces the implementation method of multilevel selection in ASP.
Tables containing level two information in SQL Server 7.0 database countrydoc are countryname char (20) and Provincename char (20) respectively.
Considering that the country name, state name is string data, and does not contain the character "0", a 5 consecutive character "0" is used as the separator between different data items when the encoding method is selected. After the code of the province data specific form of "Beijing 00000 Shanghai 00000 Heilongjiang 00000 Jilin."
<script language=vbscript>
Dim Provincearr ()
Dim Provincenum, Provincestr
String decoding, which returns the option separated by ' 00000 ' to the corresponding dynamic array
Sub Mystrtoarray
Dim i,tmpint,tmpstr
ReDim Provincearr (ProvinceNum-1)
Tmpstr=provincestr
For i=0 to ProvinceNum-1 step 1
Tmpint=instr (Tmpstr, "00000")
Provincearr (i) =left (tmpstr,tmpint-1)
Tmpstr=right (Tmpstr,len (TMPSTR)-tmpint-4)
Next
End Sub
Add an alternative to the Select Select Object at the provincial level
Sub AddOption (OPTIONSTR)
Dim ooption
Set ooption=document.createelement ("option")
Ooption.value=optionstr
Ooption.text=optionstr
Form1. Provincelist.add (ooption)
End Sub
Clears all alternatives to the provincial select object (except the first item)
Sub Clearoption
Dim count,i
Count=form1. Provincelist.length
If Count<=1 Then
Exit Sub
End If
For i=count-1 to 1 step-1
Form1. Provincelist.remove (i)
Next
End Sub
Update data in provincial alternatives when the user selects National options
Sub Countrylist_onchange
Dim countryname,i
Get the name of the country
Countryname=form1. Countrylist.value
If countryname= "None" then
Exit Sub
End If
Find the appropriate hidden object based on the country name and remove the province, State data (string) from it
For i=0 to form1.elements.length-1 step 1
If InStr (form1.elements (i). Name,countryname & "Arr") >0 andform1.elements (i) tagname= "INPUT" Then
Provincestr=form1.elements (i). Value
End If
If Form1.elements (i). Tagname= "INPUT" and InStr (form1.elements (i) Name,countryname & "Num") >0 Then
Provincenum=form1.elements (i). Value
End If
Next
If Provincenum=0 Then
Exit Sub
End If
Clears the data in the provincial selection (except the first item)
Clearoption
String decoding (the provincial data in the form of a string is stored in the global variable PROVINCESTR)
Mystrtoarray
Reconstruct the data information in the provincial selection
For i=0 to ProvinceNum-1 step 1
AddOption (Provincearr (i))
Next
Form1. Provincelist.selectedindex=0
End Sub
</script>
<body>
<form name=form1>
<table align=center>
<tr><td> National </td>
<td> provinces, States </td></tr>
<tr><td><select name=countrylist>
<option value=none>_______________</option>
<%@ Language=vbscript%>
<% Dim Countryarr ()%>
<% i=0%>
Extracts all country options in the table and writes to the national selection control
<% sqltext= "SELECT distinct countryname from Countrydoc"%>
<% set Rs=conn. Execute (SQLTEXT)%>
<% do, not Rs. EOF%>
<% i=i+1%>
<% ReDim Preserve Countryarr (i)%>
Write state-level data to a dynamic array
<%countryarr (i-1) =trim (RS ("CountryName"))%>
<optionvalue=<%=trim (R ("CountryName"))%>>
<%=trim (RS ("CountryName"))%></option>
<% Rs. MoveNext%>
<% Loop%>
<% Rs. Close%>
<% countrynum=i%>
</select>
</td><td>
<select name=provincelist>
<option value=none>_______________</option>
</select></td></tr></table>
The state name is extracted from the dynamic array, and the corresponding provincial data information is extracted.
<% for I=0 to CountryNum-1 step 1%>
<% Temp1=countryarr (i)%>
<% provincenum=0%>
<% sqltext= "SELECT COUNT (*) as Recordnum from Countrydoc where Countryname= '" & Temp1 & "'"%><% set Rs=conn. Execute (SQLTEXT)%>
<% Provincenum=rs ("Recordn
