给服务器端DropDownList控件添加客户端onchange事件
2009-10-21 16:28
507 查看
我们在许多是时候,要在DropDownList添加一个onchange事件,在.Cs文件中我们还有一个onSelectedIndexChanged事件,我们添加它的onchange事件,大部分就是为了在客户端先让用户确认一下,在回传服务器,提高用户体验性。
而如果我们在Html源代码中,自己给它加上onchange事件的话,有可能提示"服务器标记不正确"或你没有得到你所期望的值。For Example:
Code
其中调用的js代码是:
Code
我们如果执行上面的代码,会提示什么呢?你一定认为它提示的是 From:0 To:MyDropDownListSex,但是事与愿违,它提示的却是From:0 To:<%= MyDropDownListSex.ClientID %>。为什么会出现这个结果呢?查阅了一些资料也没有获得满意的结果,如果哪位有知道的还请指导。咱们还是接着往下说解决办法。
那如果我们真的想这么做的话,难道就没有办法解决了吗?不,我们可能经常给TextBox在后台添加属性,那么我们也可以在后台动态给DropDownList动态的加上onchange属性,那我们试试:在.Cs中OnPage_Load中加上:
Code
F5运行,然后选择,那么结果就出来了 ,From:0 To:MyDropDownListSex,正如我们所希望的结果。
还有一种情况就是我们的DropDownList包含在一个数据列表控件中比如:repeater中,那么我们在onPage_Load事件中就没有MyDropDownList这个控件了,那我们怎么实现呢?其实很简单,如果我们能够找到这个MyDropDownList空间就行了,由于这个比较简单,在这就不详细说明了,就列出一些代码看看就行了。
List 1:
Code
List 2:
Code
List 3:
Code
而如果我们在Html源代码中,自己给它加上onchange事件的话,有可能提示"服务器标记不正确"或你没有得到你所期望的值。For Example:
Code
<asp:DropDownList runat="server" ID="MyDropDownListSex" onchange="JavaScript:selectChange(this,'<%= MyDropDownListSex.ClientID %>');"> <asp:ListItem>boy</asp:ListItem> <asp:ListItem>girl</asp:ListItem> </asp:DropDownList>
其中调用的js代码是:
Code
<mce:script type=""><!-- function selectChange(from,to) { alert("From:"+from.selectedIndex+" To: "+to); } // --></mce:script>
我们如果执行上面的代码,会提示什么呢?你一定认为它提示的是 From:0 To:MyDropDownListSex,但是事与愿违,它提示的却是From:0 To:<%= MyDropDownListSex.ClientID %>。为什么会出现这个结果呢?查阅了一些资料也没有获得满意的结果,如果哪位有知道的还请指导。咱们还是接着往下说解决办法。
那如果我们真的想这么做的话,难道就没有办法解决了吗?不,我们可能经常给TextBox在后台添加属性,那么我们也可以在后台动态给DropDownList动态的加上onchange属性,那我们试试:在.Cs中OnPage_Load中加上:
Code
MyDropDownListSex.Attributes.Add("onchange", "selectChange(this,'"+this.MyDropDownListSex.ClientID+"')");
F5运行,然后选择,那么结果就出来了 ,From:0 To:MyDropDownListSex,正如我们所希望的结果。
还有一种情况就是我们的DropDownList包含在一个数据列表控件中比如:repeater中,那么我们在onPage_Load事件中就没有MyDropDownList这个控件了,那我们怎么实现呢?其实很简单,如果我们能够找到这个MyDropDownList空间就行了,由于这个比较简单,在这就不详细说明了,就列出一些代码看看就行了。
List 1:
Code
<asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound"> <ItemTemplate> <%#Eval("name") %> <asp:HiddenField ID="myyear" runat="server" Value='<%#Eval("year") %>' /> <asp:DropDownList ID="DropDownList1" runat="server"> <asp:ListItem>1</asp:ListItem> <asp:ListItem>2</asp:ListItem> </asp:DropDownList>
List 2:
Code
DataTable dt = new DataTable(); dt.Columns.Add("name"); dt.Columns.Add("age"); dt.Columns.Add("year"); DataRow dr = dt.NewRow(); dr[0] = "兴百放"; dr[1] = "22"; dr[2] = "1986"; dt.Rows.Add(dr); DataRow dr2 = dt.NewRow(); dr2[0] = "王明"; dr2[1] = "25"; dr2[2] = "1984"; dt.Rows.Add(dr2); this.Repeater1.DataSource = dt; this.Repeater1.DataBind();
List 3:
Code
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e) { DropDownList dl = (DropDownList)e.Item.FindControl("DropDownList1"); HiddenField hf = (HiddenField)e.Item.FindControl("myyear"); dl.Attributes.Add("onchange", "JavaScript:selectChange(this,'"+hf.Value+"')"); }
相关文章推荐
- 给服务器端DropDownList控件添加客户端onchange事件
- 给服务器端DropDownList控件添加客户端onchange事件
- 给服务器端DropDownList控件添加客户端onchange事件
- 20100401 学习笔记:DropDownList等控件添加客户端onchange事件
- 给dropdownlist等控件增加客户端onchange事件
- 给dropdownlist等控件增加客户端onchange事件
- DropDownList添加客户端下拉事件操作
- 在后台cs文件给控件添加属性(添加客户端事件javascript)
- 为服务器控件添加javascript客户端事件(zz)
- 为服务器控件添加javascript客户端事件
- 一点小注意:为Html Server控件添加客户端和服务器端的Event Handler
- asp 为html控件添加服务器端事件
- 客户端用JavaScript填充DropDownList控件,服务器端读不到值
- 屏蔽TreeView服务器端事件,添加有效的客户端事件
- .net客户端得到服务器端控件方法(服务器端控件触发客户端事件)
- 如何给服务器端控件(TextBox)添加JavaScritp脚本事件
- ASP.NET 服务器端控件响应客户端事件
- 为服务器控件添加javascript客户端事件
- 客户端用JavaScript填充DropDownList控件 服务器端读不到值
- 为服务器控件添加javascript客户端事件