如何使用javascript或jquery检测下拉列表中选择的重复值?

时间:2011-09-13 07:06:43

标签: javascript jquery asp.net

enter image description here我在转发器内部有一个gridview,并且在gridview中有一个下拉列表。现在我想没有用户可以选择一个值两次。我的代码是

<asp:Repeater ID="rep_test" runat="server">
    <ItemTemplate>
       <asp:GridView ID="grd_test" runat="server" Style="text-align: center;
                width: 375px;" AutoGenerateColumns="false">
                <Columns>
                    <asp:BoundField HeaderText="hello" DataField="hello" />
                </Columns>
                <Columns>
                    <asp:BoundField HeaderText="item" DataField="item" />
                </Columns>
                <Columns>                        
                    <asp:TemplateField HeaderText="Assign to">
                        <ItemTemplate>
                            <asp:DropDownList ID="drp_Assign" runat="server">
                                <asp:ListItem Value="1"> 1</asp:ListItem>
                                <asp:ListItem Value="2">2</asp:ListItem>
                                <asp:ListItem Value="3">3</asp:ListItem>
                            </asp:DropDownList>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <asp:DropDownList ID="drp_Address" runat="server">
            </asp:DropDownList>
    </ItemTemplate>
</asp:Repeater>

我想检测drodown“drp_Assign”的重复值。

如果用户为一行选择“1”,则无法在第二行中选择相同的值,请参阅图像,comp编号中的值不应重复。如果他尝试这样做,那么将显示警告消息,您已选择此值已经选择了另一个。“

1 个答案:

答案 0 :(得分:1)

我使用转发器作为容器#rep_test,并匹配容器内的所有下拉列表,以便用户无法选择相同的值。

注意:在浏览器中仔细检查您的Repeater ID,因为.Net会更改它。

除非您将客户端ID模式更改为静态[.Net 4.0],例如:

<asp:Repeater ID="rep_test" runat="server" ClientIDMode="Static">

参考:http://weblogs.asp.net/asptest/archive/2009/01/06/asp-net-4-0-clientid-overview.aspx

<强> JQuery的:

 $(function() {

    $('#rep_test select').live('change',function(event) {
        var cI = $(this);
        $('#rep_test select option:selected').each(function(i, e) {
            //Check if values match AND if not default AND not match changed item to self
            if ($(e).val() == cI.val() && $(e).val() != 0 && $(e).parent().index() != cI.index()) {

                alert('Duplicate found!');
                cI.val('0');
            }
        });
    });

});

工作示例: http://jsfiddle.net/zrcZM/2