how to detect duplicate value selected in dropdown using javascript or jquery?

Question

enter image description here i have a gridview inside a repeater, and a dropdownlist insid the gridview. now i want no user can select one value twice.my code is

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

i want to detect the duplicate value for drodown "drp_Assign".

please see the image the values in comp number should not be duplicate if a user selected "1" for one row then he will not be able to selected same value in second row . if he tries to do then alert message will be shown that you have selected this value already choose another."

You need to explain more clearly what you need to be achieved in the code. — Răzvan Flavius Panda
– Răzvan Flavius Panda, Commented Sep 13, 2011 at 7:19

Marc Uberstein · Accepted Answer · 2011-09-13 09:28:19Z

1

I am using the repeater as the container, #rep_test, and matching all dropdowns inside the container so that user can't select same values.

NOTE : Double check your Repeater ID in your browser as .Net will change it.

UNLESS you change your Client ID Mode to static [.Net 4.0], e.g. :

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

REF : 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');
            }
        });
    });

});

WORKING EXAMPLE : http://jsfiddle.net/zrcZM/2

edited Sep 13, 2011 at 9:28

answered Sep 13, 2011 at 7:30

Marc Uberstein

12.6k4 gold badges47 silver badges73 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Ram Singh Over a year ago

sir thats ok but the id in any databound control will always changed.So the example you have provide me is for same id. but in my case the id always changed so.. please if you have suggestion or help for that. then dont hesitate

Marc Uberstein Over a year ago

That is why I don't use an ID as my selector, but a Class. So you can use this <asp:DropDownList ID="drp_Assign" runat="server" CSSClass='fDrop'> ...It will get all dropdowns with that css class. Let me know if you understand

Marc Uberstein Over a year ago

Mmmmm strange. Can you open your page in your browser, copy the generated html and scripts, paste it in jsfiddle.net . So I can see what's the problem.

Marc Uberstein Over a year ago

*Remember to call the jquery script at the end of the page / on dom ready. And/OR you can change your event bind to .live. this will work for dynamic html content, see link : jsfiddle.net/zrcZM/1

Ram Singh Over a year ago

sir please review my code the dropdown is inside a grid and grid is in a repeater it clearly shows i have to repeat grid so your logic is not useful for this condition i have to do it according to id only..

|

Collectives™ on Stack Overflow

how to detect duplicate value selected in dropdown using javascript or jquery?

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related