[ASP.NET 控件实作] 解决 DropDownList 成员 Value 值相同产生的问题

你所在位置：首页〉VS.net〉ASP.net〉控件〉[ASP.NET 控件实作] 解决 DropDownList 成员 Value 值相同产生的问题
[ASP.NET 控件实作] 解决 DropDownList 成员 Value 值相同产生的问题
作者：jeff377 文章来源：博客园发布日期：2008-10-31 浏览次数：60
打印这篇文章
DropDownList 控制页的成员清单中，若有 ListItem 的 Value 值是相同的情形时，会造成 DropDownList 无法取得正确的 SelectedIndex 属性值、且无法正确引发 SelectedIndexChanged 事件的问题；今天刚好在网络上看到有人在询问此问题，所以本文将说明这个问题的源由，并修改 DropDownList 控件来解决这个问题。

程序代码下载：ASP.NET Server Control - Day29.rar

一、DropDownList 的成员 Value 值相同产生的问题

我们先写个测试程序来描述问题，在页面上放置一个 DropDownList 控件，设定 AutoPostBack=True，并加入四个 ListItem，其中 "王五" 及 "陈六" 二个 ListItem 的 Value 值相同。
```
    〈asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
```
```
            〈asp:ListItem Value="0">張三〈/asp:ListItem>
```
```
            〈asp:ListItem Value="1">李四〈/asp:ListItem>
```
```
            〈asp:ListItem Value="2">王五〈/asp:ListItem>
```
```
            〈asp:ListItem Value="2">陳六〈/asp:ListItem>
```
```
    〈/asp:DropDownList>
```
在 DropDownList 的 SelectedIndexChanged 事件，输出 DropDownList 的 SelectedIndex 及 SelectedValue 属性值。
```
    Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
```
```
        Dim sText As String
```
```
 
```
```
        sText = String.Format("DropDownList: Index={0} Value={1}", DropDownList1.SelectedIndex, DropDownList1.SelectedValue)
```
```
        Me.Response.Write(sText)
```
```
    End Sub
```
执行程序，在 DropDownList 选取 "李四" 这个选项时，会正常显示该成员的 SelectedIndex 及 SelectedValue 属性值。

接下来选取 "陈六" 这个选项时，竟然发生奇怪的现象，DorpDownList 竟然显示相同 Value 值的 "王五" 这个成员的 SelectedIndex 及 SelectedValue 属性值。

二、问题发生的原因

我们先看一下 DropDownList 输出到客户端的 HTML 原始码。
```
〈select name="DropDownList1" onchange="javascript:setTimeout('__doPostBack(\'DropDownList1\',\'\')', 0)" id="DropDownList1">
```
```
    〈option selected="selected" value="0">張三〈/option>
```
```
    〈option value="1">李四〈/option>
```
```
    〈option value="2">王五〈/option>
```
```
    〈option value="2">陳六〈/option>
```
```
〈/select>
```
DropDownList 是呼叫 __doPostBack 函式，只传入 eventTarget参数 (对应到 __EVENTTARGET 这个 HiddenField) 为 DropDownList 的 ClientID；当 PostBack 回伺服端时，在 DropDownList 的 LoadPostData 方法中，会取得客户端选取的 SelectedValue 值，并去寻找对应的成员的 SelectedIndex 值。可是问题来了，因为 "王五" 与 "陈六" 的 Value 是相同的值，当在寻找符合 Value 值的成员时，前面的选项 "王五" 会先符合条件而传回该 Index 值，所以先造成取得错误的 SelectedIndex 。
```
Protected Overridable Function LoadPostData(ByVal postDataKey As String, ByVal postCollection As NameValueCollection) As Boolean
```
```
    Dim values As String() = postCollection.GetValues(postDataKey)
```
```
    Me.EnsureDataBound
```
```
    If (Not values Is Nothing) Then
```
```
        MyBase.ValidateEvent(postDataKey, values(0))
```
```
        Dim selectedIndex As Integer = Me.Items.FindByValueInternal(values(0), False)
```
```
        If (Me.SelectedIndex 〈> selectedIndex) Then
```
```
            MyBase.SetPostDataSelection(selectedIndex)
```
```
            Return True
```
```
        End If
```
```
    End If
```
```
    Return False
```
```
End Function
```
三、修改 DropDownList 控件来解决问题

要解决这个问题最好的方式就是直接修改 DropDownList 控件，自行处理前端呼叫 __doPostBack 的动作，将客户端 DropDownList 选择 SelectedIndex 一并传回伺服端。所以我们继承 DropDownList 命名为 TBDropDownList，覆写 AddAttributesToRender 来自行输出 PostBack 的客户端指令码，我们会用一个变量记录 AutoPostBack 属性，并强制将 AutoPostBack 属性值设为 False，这是为了不要 MyBase 产生 PostBack 的指令码；然后再自行输出 AutoPostBack 客户端指令码，其中 __doPostBack 的 eventArgument 参数 (对应到 __EVENTARGUMENT 这个 HiddenField) 传入 this.selectedIndex。
```
        Protected Overrides Sub AddAttributesToRender(ByVal writer As HtmlTextWriter)
```
```
            Dim bAutoPostBack As Boolean
```
```
            Dim sScript As String
```
```
 
```
```
            '記錄 AutoPostBack 值，並將 AutoPostBack 設為 False，不要讓 MyBase 產生 PostBack 的指令碼
```
```
            bAutoPostBack = Me.AutoPostBack
```
```
            Me.AutoPostBack = False
```
```
 
```
```
            MyBase.AddAttributesToRender(writer)
```
```
 
```
```
            If bAutoPostBack Then
```
```
                MyBase.Attributes.Remove("onchange")
```
```
                sScript = String.Format("__doPostBack('{0}',{1})", Me.ClientID, "this.selectedIndex")
```
```
                writer.AddAttribute(HtmlTextWriterAttribute.Onchange, sScript)
```
```
                Me.AutoPostBack = True
```
```
            End If
```
```
        End Sub
```
在页面上放置一个 TBDropDownList 控件，设定与上述案例相同的成员清单。
```
        〈bee:TBDropDownList ID="DropDownList2" runat="server" AutoPostBack="True">
```
```
            〈asp:ListItem Value="0">張三〈/asp:ListItem>
```
```
            〈asp:ListItem Value="1">李四〈/asp:ListItem>
```
```
            〈asp:ListItem Value="2">王五〈/asp:ListItem>
```
```
            〈asp:ListItem Value="2">陳六〈/asp:ListItem>
```
```
        〈/bee:TBDropDownList>
```
执行程序查看 TBDropDownList 控件的 HTML 原始码，呼叫 __doPostBack 函式的参数已经被修改，eventArgument 参数会传入该控件的 selectedIndex。
```
〈select name="DropDownList2" id="DropDownList2" onchange="__doPostBack('DropDownList2',this.selectedIndex)">
```
```
    〈option selected="selected" value="0">張三〈/option>
```
```
    〈option value="1">李四〈/option>
```
```
    〈option value="2">王五〈/option>
```
```
    〈option value="2">陳六〈/option>
```
```
〈/select>
```
接下来还要覆写 LoadPostData 方法，取得 __EVENTARGUMENT 这个 HiddenField 的值，并判断与原 SelectedIndex 属性值是否不同，不同的话传回 True，使其产生 SelectedIndexChanged 事件。
```
        Protected Overrides Function LoadPostData(ByVal postDataKey As String, ByVal postCollection As NameValueCollection) As Boolean
```
```
            Dim values As String()
```
```
            Dim iSelectedIndex As Integer
```
```
 
```
```
            Me.EnsureDataBound()
```
```
            values = postCollection.GetValues(postDataKey)
```
```
 
```
```
            If (Not values Is Nothing) Then
```
```
                iSelectedIndex = CInt(Me.Page.Request.Form("__EVENTARGUMENT"))
```
```
                If (Me.SelectedIndex 〈> iSelectedIndex) Then
```
```
                    MyBase.SetPostDataSelection(iSelectedIndex)
```
```
                    Return True
```
```
                End If
```
```
            End If
```
```
            Return False
```
```
        End Function
```
四、测试程序

在 TBDropDownList 的 SelectedIndexChanged 事件撰写如下测试程序代码。
```
    Protected Sub DropDownList2_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList2.SelectedIndexChanged
```
```
        Dim sText As String
```
```
 
```
```
        sText = String.Format("TBDropDownList: Index={0} Value={1}", DropDownList2.SelectedIndex, DropDownList2.SelectedValue)
```
```
        Me.Response.Write(sText)
```
```
    End Sub
```
执行程序，在 TBDropDownList 选取 "王五" 这个选项时，会正常显示该成员的 SelectedIndex 及 SelectedValue 属性值。

接下选取 Value 值相同的 "陈六" 这个选项，也会正常引发 SelectedIndexChanged ，并显示该成员的 SelectedIndex 及 SelectedValue 属性值。
打印这篇文章
与本文主题相关的文章
- ASP.NET 控件的可访问指南
- asp.net 2.0中扩展login控件
- asp.net中实现DetailsView控件下的两个DropDownList级连变动
- ASP.NET 2.0中使用HiddenField控件
- 列表控件(DropDownList,ListBox和BulletedList)
- ASP.NET：ListBox数据合并问题
- 动态生成DropDownList发生的事件
- DropDownList 类
- 使用DropDownList过滤的主/从报表
- 网页中DIV的两种用法
- DropDownList无刷新及联的简单做法
- DropDownList 无刷新解决
- [ASP.NET 控件实作] TBContextMenu 控件三种不同模式的 Click 动
- [ASP.NET 控件实作] 整合 jQuery ContextMenu plugin 的右键选单
- [ASP.NET 控件实作] 图形验证码控件
- [ASP.NET 控件实作] 控件依 FormView CurrentMode 自行设定状态
- [ASP.NET 控件实作] Flash 控件
- [ASP.NET 控件实作] 继承 CompositeControl 实作 Toolbar 控件
- [ASP.NET 控件实作] 复合控件隐藏的问题
- [ASP.NET 控件实作] 继承 WebControl 实作 Toolbar 控件
- [ASP.NET 控件实作] 集合属性包含不同型别的成员
- [ASP.NET 控件实作] 修改集合属性编辑器
- [ASP.NET 控件实作] 控件设计阶段的外观
- [ASP.NET 控件实作] 让 DropDownList 不再因项目清单不存在而造成
- [ASP.NET 控件实作] 自订 GridVie 字段类别：实作 TBDropDownFie
- 让 DropDownList 不再因项目清单不存在而造成错误
- asp.net 控件开发(三)处理标签间内容
- Asp.net 控件开发（四）数据回传
- 讓 DropDownList DataBind 不再發生錯誤
- asp.net 控件开发（一）—显示控件内容
- XML基础教程：使用xsl：value-of来计算节点值
- 下拉列表DropDownList
- 如何实现DropDownList控件选项的添加、删除等操作
- 如何实现间接改变DropDownList控件的当前选项
- 如何实现两个或多个DropDownList控件的联动
- 带图片的多列的DropDownList的实现
- vs2005/.net2.0 控件实例之下拉列表《DropDownList》
- DataGrid和DropDownList的一些配合以及使用css定制DataGrid(转)
- 实现无刷新DropdownList联动效果
- 给DropDownList服务器控件添加项的新方法