给服务器端DropDownList控件添加客户端onchange事件

我们在许多是时候，要在DropDownList添加一个onchange事件，在.Cs文件中我们还有一个onSelectedIndexChanged事件，我们添加它的onchange事件，大部分就是为了在客户端先让用户确认一下，在回传服务器，提高用户体验性。

而如果我们在Html源代码中，自己给它加上onchange事件的话，有可能提示"服务器标记不正确"或你没有得到你所期望的值。For Example:

<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代码是：

<script type="">

function selectChange(from,to)

</script>

我们如果执行上面的代码，会提示什么呢？你一定认为它提示的是 From:0 To:MyDropDownListSex，但是事与愿违，它提示的却是From:0 To:<%= MyDropDownListSex.ClientID %>。为什么会出现这个结果呢？查阅了一些资料也没有获得满意的结果，如果哪位有知道的还请指导。咱们还是接着往下说解决办法。

那如果我们真的想这么做的话，难道就没有办法解决了吗？不，我们可能经常给TextBox在后台添加属性，那么我们也可以在后台动态给DropDownList动态的加上onchange属性，那我们试试：在.Cs中OnPage_Load中加上：

MyDropDownListSex.Attributes.Add("onchange", "selectChange(this,'"+this.MyDropDownListSex.ClientID+"')");

F5运行，然后选择，那么结果就出来了 ，From:0 To:MyDropDownListSex，正如我们所希望的结果。

还有一种情况就是我们的DropDownList包含在一个数据列表控件中比如：repeater中，那么我们在onPage_Load事件中就没有MyDropDownList这个控件了，那我们怎么实现呢？其实很简单，如果我们能够找到这个MyDropDownList空间就行了，由于这个比较简单，在这就不详细说明了，就列出一些代码看看就行了。

List 1:

<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:

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:

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+"')");

}