服务器之家:专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - ASP.NET教程 - 客户端用JavaScript填充DropDownList控件 服务器端读不到值

客户端用JavaScript填充DropDownList控件 服务器端读不到值

2019-09-08 11:21asp.net之家 ASP.NET教程

今天遇到一个奇怪的问题,某一页面需要使用三级级联下拉列表框。为提高用户体验,采用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> 


结束。

延伸 · 阅读

精彩推荐