版权所有:基础软件。作者邮箱:sun.j.l.studio@gmail.com。本文首发于 http://www.cnblogs.com/FoundationSoft。文章转载请保持此版权信息并注明出处。
今天遇到一个奇怪的问题,某一页面需要使用三级级联下拉列表框。为提高用户体验,采用jQuery的cascadingDropDown插件调用后台Web Services来实现ajax填充。填充没有任何问题,但是在服务器端却取不出来下拉表中的内容。页面代码如下。
< form id ="form1" runat ="server" > < div > < h3 > 看看用js填充的dropdownlist控件在服务器端能读出来吗? </ h3 > 三个级联下拉列表框: < asp:DropDownList runat ="server" id ="bigTypeList" Width ="150" > </ asp:DropDownList > < asp:DropDownList runat ="server" id ="typeList" Width ="150" > </ asp:DropDownList > < asp:DropDownList runat ="server" id ="smalltypeList" Width ="150" > </ asp:DropDownList > < br /> < asp:Button runat ="server" Text ="读取下拉表" ID ="OK" onclick ="OK_Click" />< br /> 你选的是: < asp:Label runat ="server" Text ="Label" ID ="label1" ></ asp:Label > </ div > </ form >
用来测试的后台代码如下。
protected void OK_Click( object sender, EventArgs e){ ListItem[] array = new ListItem[ 3 ]; array[ 0 ] = bigTypeList.SelectedItem; // 为null array[ 1 ] = typeList.SelectedItem; // 为null array[ 2 ] = smalltypeList.SelectedItem; // 为null }
事实证明,在服务器端读取客户端填充的DropDownList控件的值时,根本读不到任何内容。DropDownList.Items.Count为0,DropDownList.SelectedItem为null。
那么,怎么得到这个值呢,只好使用Request.Form["控件的客户端ID"]了。如下代码所示。
string s = Request.Form[typeList.ClientID];
附:页面中的JavaScript文件。
< script language = " javascript " type = " text/javascript " > $( function () { var bigId = ' #<%=bigTypeList.ClientID%> ' ; var mediumId = ' #<%=typeList.ClientID%> ' ; var smallId = ' #<%=smalltypeList.ClientID%> ' ; $(bigId).cascadingDropDown(mediumId, ' ../Services/AutoTypeService.asmx/getAutoType ' , { valueMember: ' id ' , displayMember: ' name ' , cascadingArgName: ' parent ' }); $(mediumId).cascadingDropDown(smallId, ' ../Services/AutoTypeService.asmx/getSubAutoType ' , { valueMember: ' id ' , displayMember: ' name ' , cascadingArgName: ' parent ' });}); < / script>