Due to the need to link DropDownList in the application, the implementation method and process will be written below, and the resource can be shared, and the two friends can also take some detour less. . The so-called DropDownList, that is, when choosing a DropDownList, make another DropDownList's content update (if you want to select the city), press the regular method to change the second DropDownList in the first DropDownList's SELECTEDEXCHANGED event Data source and resin, but if this is reselected in each reselection, the refresh of the page will bring, except for the screen flash, if the same page has a password box, the content will also be cleared. At this time, we need no refresh implementation. The basic principle sends a request to another hidden page with JS when selecting a change and get an XML stream, and then put it in the corresponding DropDownList. The example is as follows:
First we need a page that places two DROPDOWNLIST, if it is called WebM2.aspx, the page code is as follows: <% @ page language = "codebehind =" Webform2.aspx.cs "autoeventwireup =" false "inherits =" WebApptest1 .Webform2 "%>
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 =" http://schemas.microsoft.com/intellisense / IE5 "name =" vs_targetschema "> <script> function load (state) {var drp2 = document.getlementByid (" DropDownList2 "); for (var i = 0; i <= drp2.options.length -1; i ) {Drp2.remove (i);} // Newly built a request with XML document var httpreq = new activXObject ("msxml2.xmlhttp"); var odoc = new activXObject ("msxml2.domdocument"); // Send the request to another One page, where parameter state represents DropDownList1 selected value OHTTPREQ.OPEN ("post", "WebForm6.aspx? State =" state, false); httpreq.send (""); // Take the return result and put it in XML Document Result = OHTTPREQ.RESPONSETEXT; ODOC.LOADXML (Result); // Set the root node and loop read its content items = odoc.selectnodes ("// city / table"); // City represents a data collection name, Table Representative Table name for data concentration for (var Item = items.nextNode (); item; item = items.nextNode ()) {var city = item.selectsinglenode ("// city"). NodetyPedValue; // city is the items used Content VAR newOption = Document.createElement ("option");</p>
<p>NewOption.text = city; // pull-down frame text, such as Beijing newOption.Value = city; // pull-down box value, such as 110000 Drp2.Options.Add (newOption);}} </ script> </ head> < Body ms_positioning = "flowLayout"> <form id = "form1" method = "post" runat = "server"> <ask: DropdownList ID = "DropDownList1" runat = "server"> </ asp: dropdownload> <ask: DropdownList ID = "DropDownList2" runat = "server"> </ ask: DropdownList> </ form> </ body> </ html> we have done two things in the code: 1, help one of the DropDownList (you You can also bind two). 2. Specify the client script of the control. Below we will introduce the above JS code, first get the DorpdownList object to be connected on the page, clear his options, create two client objects OHTTPREQ and ODOC objects, one of the responsible requests to receive the response results, We send the user selected to the page called Webform6.aspx, which will process this request and return a response. The result of the response is an XML file, which is later introduced in WebForm6.aspx. We use the result of the load using loadXML method LOAD to the ODoc object, and then you can use the SelectNodes method to get all the CITY node, then loop these nodes to create an Option object in the client, and finally put these Option object Add to DropdWonList2.</p>
<p>The background code of this page is as follows, written in page_load: if (! This.ispostback) {sqlConnection con = New SqlConnection ("Server = localhost; database = pubs; uid = sa; pwd = sa;") ; SqlDataAdapter da = new SqlDataAdapter ( "select state from authors group by state", con); DataSet ds = new DataSet (); this.DropDownList1.DataTextField = "State"; this.DropDownList1.DataValueField = "State"; this. DROPDOWNLIST1.DATABIND (); // Add a property that calls the above LOAD method when selecting change, here is text, the value is changed to Value. This.dropdownList1.attributes.add ("onchange" "" Load (this.Options [this.selected ");}</p>
<p>Let's take a look at what WebFowm6.aspx has done something. The HTML page of this page is an unsearable page that includes <@Page> instructions, the background of the background is as follows: Private Void Page_Load (Object Sender, System. Eventargs e) {// put user code to initialize the page head f ("state"]! = Null) {string state = this.request ["state"]. ToString (); sqlconnection con = New SqlConnection ("Server = localhost; database = pubs; uid = sa; pwd = sa;"); sqldataadapter Da = new SqlDataAdapter ("Select City from authors where state = ' state "' ", etc; DataSet DS = New Dataset ("city"); // This city represents a data collection name, consistent with DA.FILL (DS) when taking data above; xmlTextWriter Writer = new xmlTextWriter (response.Ntencoding); Writer.Formatting = Formatting .Indented; Writer.indentChar = '; ds.writexml; Writer.Flush (); response.end (); Writer.close ();} This method gets the user selected State through the STATE After the query gets a DataSet object, write the content directly to the content.outputStream and passed to the client, the client's LOAD method passes the result = OHTTPREQ.RESPONSETEXT; the sentence get an XML string, and finally resolved this string. This example is found from the Internet, but I added some comments. I encountered some problems in my practice. I would like to pay attention to: 1. If Chinese when calling the Load function, then because IE's relationship will change Mechanical code (modifying the web.config file code to gb2312 can be resolved, but at this time, the data will not be acquired, it may have a relationship with the XML document encoding request returned), so it is recommended to pass value; 2. If you have no refresh, if you There is a submission button in the page, which will not be able to get the current value of DropDownList. You can use the request.form ["DropDownList Control Name] to get the value.</p>
<p>Finally, thank you for providing any questions in your practice or if you need my actual application source code, you can contact me. Thank you reading!</p></div><div class="text-center mt-3 text-grey">
转载请注明原文地址:https://www.9cbs.com/read-84800.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="84800" 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.033</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 = '8u555HVSxdu6aPUDIkDFhYrXvip9SJrhlaqVLsNK8YMgTEBTmLGUZZgs0sIQoIBibJQStT3BtacvyHfytqaqhA_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>
