<Asp: dropdownlist id = "ddl1" runat = "server" width = "100px"> </ASP: dropdownlist> <asp: dropdownlist id = "ddl2" runat = "server" width = "100px"> </ASP: dropdownlist>
<Asp: dropdownlist id = "ddl3" runat = "server" width = "100px"> </ASP: dropdownlist>
JS:
<SCRIPT src = "JS/jquery-1.4.2.min.js" type = "text/JavaScript"> </SCRIPT> <SCRIPT type = "text/JavaScript"> $ (document ). ready (function () {geta (); $ ("# ddl1 "). change (function () {getb () ;}); $ ("# ddl2 "). change (function () {GETC () ;}); function geta () {$ ("# ddl1" ).html (""); $ ("# ddl1 "). append ("<option value = '-1' selected = 'selected'> select... </option> "); // $ (" select [name $ = ddl1]> Option: Selected "). remove (); Var Strid = 0; $. getjson ("loadclass. ashx? Ddlid = "+ Strid, function (data) {for (VAR I = 0; I <data. length; I ++) {$ ("select [name $ = ddl1]"). append ($ ("<option> </option>" ).val(data+ I }.id+.html (data [I]. cname) ;}; getb () ;}) ;} function getb () {$ ("# ddl2" ).html (""); $ ("# ddl3" cmd.html (""); var Strid = $ ("# ddl1 "). ATTR ("value"); If (Strid! = 0) {$. getjson ("loadclass. ashx? Ddlid = "+ Strid, function (data) {for (VAR I = 0; I <data. length; I ++) {$ ("select [name $ = ddl2]"). append ($ ("<option> </option>" ).val(data+ I }.id+.html (data [I]. cname) ;}; GETC () ;}}} function GETC () {$ ("# ddl3" ).html (""); vaR Strid = $ ("# ddl2 "). ATTR ("value"); If (Strid! = 0) {$. getjson ("loadclass. ashx? Ddlid = "+ Strid, function (data) {for (VAR I = 0; I <data. length; I ++) {$ ("select [name $ = ddl3]"). append ($ ("<option> </option>" ).val(data+ I }.id+.html (data [I]. cname) ;};}}}</SCRIPT>
Loadclass. ashx:
<% @ Webhandler Language = "C #" class = "loadclass" %> using system; using system. web; using system. text; using system. data; public class loadclass: ihttphandler {public void processrequest (httpcontext context) {// array [{"ID": "275", "cname": "A1 "}, {"ID": "319", "cname": "A2" },{ "ID": "322", "cname ": "A3"}] int Strid = convert. toint32 (context. request ["ddlid"]); string strsql = "select * from class where parent_ptr = "+ Strid +" order by classorder ASC "; DB d = new dB (); datatable dt = D. getdt (strsql); stringbuilder strclass = new stringbuilder (); If (DT! = NULL) {strclass. append ("["); For (INT I = 0; I <DT. rows. count; I ++) {strclass. append ("{"); strclass. append ("\" ID \ ": \" "+ dt. rows [I] ["ID"]. tostring () + "\", "); strclass. append ("\" cname \ ": \" "+ dt. rows [I] ["classcname"]. tostring () + "\" "); if (I! = DT. rows. count-1) {strclass. append ("},") ;}} strclass. append ("}"); strclass. append ("]"); context. response. contenttype = "application/JSON"; context. response. contentencoding = encoding. utf8; context. response. write (strclass. tostring (); context. response. end () ;}public bool isreusable {get {return false ;}}}
Note:
// Only the value can be obtained in the background, and text cannot be obtained directly. You must use JS and controls to transfer the value. // result: 275 276 277 label1.text = request. Form [ddl1.uniqueid] + ""
+ Request. Form ["ddl2"] + ""
+ Request. Form [ddl3.clientid. Replace ("_", "$")];
Problems:
The text value in the drop-down box is transferred through the hiddenfield control.
<Asp: hiddenfield id = "hiddenfield1" runat = "server"/> <asp: hiddenfield id = "hiddenfield2" runat = "server"/> <asp: hiddenfield id = "hiddenfield3" runat = "server"/>
Assign the value of the selected drop-down box to the hidden control:
<SCRIPT type = "text/JavaScript"> var key1 = $ ("# ddl1> Option: Selected "). val (); $ ('# hiddenfield1 '). val (key1); var key2 =$ ("# ddl2> Option: Selected "). val (); $ ('# hiddenfield2 '). val (key2); var key3 =3 ("# ddl3> Option: Selected "). val (); $ ('# hiddenfield3 '). val (key3); </SCRIPT>
The value dynamically assigned to the hiddenfield control after the drop-down box is selected cannot match the value selected in the drop-down box!
It may be related to initialization.CodeWhere should I put it? Or is there any good method? Are you welcome to discuss it?