Realize the linkage of the DROPDOWNLIST.

xiaoxiao2021-03-06  106

Description: This article is

Http://blog.9cbs.net/cuike519/archive/2004/08/22/81727.ASPX article made a little modification.

When making an article to add a function, you want to display the secondary class in the selection, you can easily implement it using DropdownList's SelectedIndexchanged event, but each time you choose the page, you will always be refreshed once, people feel Very unhappy. In order to achieve DropDownList brush-free secondary linkage, I found some information online in the past few days, but I can't reach the effect I want. After repeated debugging, this function has now been basically realized, and the code is now attached.

I. Database design:

Field name Data Type Description ClassID Auto Number Class ClassName Varchar (8) Class name UpClassIDint (4) Super Class Class ClassLevelint (4) Class level, 1 is big, 2 is small class

Second, the design steps:

1. First, we create a new page Droptest.aspx in which two DROPDOWNLIST controls: DropDownList1 and DropdownList2, its full code is as follows:

<% @ Page language = "c #" codebehind = "droptest.aspx.cs" autoeventwireup = "false" inherits = "studyweb.droptest"%> Webform2 </ title> <meta content =" Microsoft Visual Studio .NET 7.1 "Name =" Generator "> <meta content =" c # "name =" code_language "> <meta Content = "javascript" name = "vs_defaultclientscript"> <meta content = "</p> <p>http://schemas.microsoft.com/intellisense/ie5</p> <p>"Name =" vs_targetSchema "> <script> function load (ClassID) {// ClassID categories to receive a number of transmitted var drp2 = document.getElementById (" DropDownList2 "); all function (oElem) {// clear the DropDownList2 RemoveAll I = 0; for (i = Olem.length; I> = 0; i -) {Olem.Options.Remove (i);}} Removeall (DRP2) VAR OHTTPREQ = New ActiveXObject ("msxml2.xmlhttp" VAR ODOC = New ActiveXObject ("msxml2.domdocument"); ohttpreq.open ("post", "DROPCHILD.ASPX? ClassID =" classid, false); // call to read the page of small class data, will be large The class // number value passes the past OHTTPREQ.send (""); result = OHTTPREQ.RESPONSETEXT ;ODOC.LoadXML (Result); items1 = odoc.selectnodes ("// classname / table / classname); // Read all Request Big Class Class Class name items2 = odoc.selectnodes ("// ClassName / Table / ClassID"); // Read all the number of columns belonging to the columns of the columns of the small class VAR item ItemsLENGTH = items1.length; for (i = 0; i <itemslength; i ) // gives DropDownList2 {var newiption = document.createElement ("option"); newOption.Text = items1 [i]. TEXT; newOption.Value = items2 [i] .text; drp2.Options.add (newoption);}} </ script> </ head> <body ms_positioning = "flowLayout> <form id =" Form1 "Method =" POST "Runat =" Server "> <asp: DropdownList ID =" DropDownList1 "Runat ="</p> <p>Server> <asp: dropdownload = "dropdownlist2" runat = "server"> </ asp: dropdownload = "label1" rubel id = "label1" runat = "server"> </ asp: label > <Asp: button id = "button1" runat = "server" text = "button"> </ asp: button> </ form> </ body> </ html> background file (DropDownList1.aspx.cs code within) the Page_Load follows: if (this.IsPostBack) {SqlConnection con = new SqlConnection ( "server = localhost; database = gswebDB; uid = sa; pwd =;"); SqlDataAdapter da = new SqlDataAdapter ( "select ClassName! , ClassID from classname where classlevel = 1 ", con); dataset ds = new dataset (); da.fill (ds); this.dropdownList1.datasource = ds.tables [0] .defaultview; this.dropdownList1.DataTextField =" ClassName "; this.DropDownList1.DataValueField =" ClassID "; this.DropDownList1.DataBind (); this.DropDownList1.Attributes.Add (" onchange "," load (this.options [this.selectedIndex] .value) "); // Transfer ClassID to the script function load (classID), if you want to pass the classname, you should change the value to InnerText, but if it is a big class is Chinese, the problem that cannot be displayed when the class is called} This page is implemented As follows: First, read all class names and class numbers, binding to all class levels within the database. DROPDOWNLIST1 control; then call the JavaScript function load (ClassID) through the attributes attribute of DropDownList1; LOAD () function read the XML stream by calling the DropChild.aspx page, get the classname and classid of the Class Class belonging.</p> <p>2, create a new DROPCHILD.ASPX page file, which is not inserted into any controls and text, add the following code only in its inaudild.aspx.cs: if (this.Request ["classid"]! = Null ) {int state = Convert.ToInt32 (this.Request [ "ClassID"]); SqlConnection con = new SqlConnection ( "server = localhost; database = gswebDB; uid = sa; pwd =;"); SqlDataAdapter da = new SqlDataAdapter ( "select className, ClassID from classname where UpClassID = '" state "'", con); DataSet ds = new DataSet ( "cLASSNAME"); da.Fill (ds); XmlTextWriter writer = new XmlTextWriter (Response.OutputStream, Response .Contentencoding; writer.formatting = formatting.indented; Writer.indentation = 4; Writer.indentChar = '; ds.writexml; Writer.Flush (); response.end (); Writer.Close (); This method gets the large class number selected by the user. After getting a DataSet object after query, write the content directly to the loonse.outputstream and passed to the client, the client's Load method passes Result = OHTTPREQ.RESPONSETEXT ; A sentence get an XML string, and finally parsing this string. In addition, the DROPDOWNLIST2 value is obtained by request.form, and the process code is processed as follows: private void button1_click (object sender, system.ext {label1.text = this.Request.form ["DropdownList2"]. Tostring ();</p> <p>Since I am an initial ASP.NET, I don't here, please give some second. <% @ Page language = "c #" codebehind = "Droptest.aspx.cs" autoeventwireup = "false" inherits = "studyweb.droptest"%></p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-101460.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="101460" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.047</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = '05Ad8MyMRzvwA_2B1R4XA0pHaJcxL1u7DAsp_2BXAcmDWhmZXiH8co87XCxdl_2Fu4RCz5M6gXucDe_2BxbAyt01IpvAUA_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>