Click here to Skip to main content
14,426,851 members
Rate this:
Please Sign up or sign in to vote.
See more:
HI
I have six dropdownlist with same values in my aspx page.If user selected first item from first dropdowlist then that selected item sholud be disabled from other dropdownlist.
user should select any option only once.

here is my code:-
This code is working properly in Mozila except IE7.I want it should work in IE7 also.
--- script----->
<script type="text/javascript">

        $(function () {
            
            $('select').each(function (cSelect) {
                $(this).data('stored-value', $(this).val());
            });
            
            $('.ddlselect').change(function () {
                var previousVal = $(this).data('stored-value'); //get previous selected value
                var selectedVal = $(this).val(); //get selected dropdown value 

                $(this).data('stored-value', selectedVal); //set new selected value

                var eleid = $(this).attr("id");
                $(".ddlselect").each(function () {

                    if ($(this).attr("id") !== eleid) {
                        $(this).parent().find('option[value="' + selectedVal + '"]:not(:selected)').attr('disabled', 'disabled');
                    }
                });
            });
        });
        
    </script>


-- controls---->
<asp:DropDownList ID="DropDownList_1" runat="server" CssClass="ddlselect">
       <asp:ListItem>1
       <asp:ListItem>2
       <asp:ListItem>3
       <asp:ListItem>4
       <asp:ListItem>5
       <asp:ListItem>6
       <asp:ListItem>7
       <asp:ListItem>8
       <asp:ListItem>9
       <asp:ListItem>10


   <asp:DropDownList ID="DropDownList_2" runat="server" CssClass="ddlselect">
       <asp:ListItem>1
       <asp:ListItem>2
       <asp:ListItem>3
       <asp:ListItem>4
       <asp:ListItem>5
       <asp:ListItem>6
       <asp:ListItem>7
       <asp:ListItem>8
       <asp:ListItem>9
       <asp:ListItem>10

   <asp:DropDownList ID="DropDownList_3" runat="server" CssClass="ddlselect">
       <asp:ListItem>1
       <asp:ListItem>2
       <asp:ListItem>3
       <asp:ListItem>4
       <asp:ListItem>5
       <asp:ListItem>6
       <asp:ListItem>7
       <asp:ListItem>8
       <asp:ListItem>9
       <asp:ListItem>10



Any idea how disable the option of dropdownlist in IE7.
Or we need to use specific version of jQuery for this.

Thanks
Ashish
Posted
Updated 16-Nov-12 3:47am
v3
Comments
Ravi Tuvar 16-Nov-12 6:34am
   
if ($(this).attr("id") != eleid) {
$(this).parent().find('option[value="' + selectedVal + '"]:not(:selected)').attr('disabled', 'disabled');
}
try this
asbis 16-Nov-12 8:09am
   
HI Rabi
this same code which im using but still it is not working for me in IE7.
I am using IE7 browser.
Any idea ???
Rate this:
Please Sign up or sign in to vote.

Solution 1

$(function () {

            $('select').each(function (cSelect) {
                $(this).data('stored-value', $(this).val());
            });

            $('.ddlselect').change(function () {
                var previousVal = $(this).data('stored-value'); //get previous selected value
                var selectedVal = $(this).val(); //get selected dropdown value 

                $(this).data('stored-value', selectedVal); //set new selected value

                var eleid = $(this).attr("id");
                $(".ddlselect").each(function () {

                    if ($(this).attr("id") !== eleid) {
                        $(this).parent().find('option[value="' + selectedVal + '"]:not(:selected)').attr('disabled', 'disabled');
                    }
                });
            });
        });

<asp:dropdownlist runat="server" id="DropDownList_1" cssclass="ddlselect" >
         <asp:listitem>1</asp:listitem>
      <asp:listitem>2</asp:listitem>
      <asp:listitem>3</asp:listitem>
      <asp:listitem>4</asp:listitem>
      <asp:listitem>5</asp:listitem>
      <asp:listitem>6</asp:listitem>
      <asp:listitem>7</asp:listitem>
      <asp:listitem>8</asp:listitem>
      <asp:listitem>9</asp:listitem>
      <asp:listitem>10</asp:listitem>
      </asp:dropdownlist>
      <asp:dropdownlist id="DropDownList_2" runat="server" cssclass="ddlselect">
        <asp:listitem>1</asp:listitem>
      <asp:listitem>2</asp:listitem>
      <asp:listitem>3</asp:listitem>
      <asp:listitem>4</asp:listitem>
      <asp:listitem>5</asp:listitem>
      <asp:listitem>6</asp:listitem>
      <asp:listitem>7</asp:listitem>
      <asp:listitem>8</asp:listitem>
      <asp:listitem>9</asp:listitem>
      <asp:listitem>10</asp:listitem>
      </asp:dropdownlist>
      <asp:dropdownlist id="DropDownList_3" runat="server" cssclass="ddlselect" >
        <asp:listitem>1</asp:listitem>
      <asp:listitem>2</asp:listitem>
      <asp:listitem>3</asp:listitem>
      <asp:listitem>4</asp:listitem>
      <asp:listitem>5</asp:listitem>
      <asp:listitem>6</asp:listitem>
      <asp:listitem>7</asp:listitem>
      <asp:listitem>8</asp:listitem>
      <asp:listitem>9</asp:listitem>
      <asp:listitem>10</asp:listitem>
      </asp:dropdownlist>


Check this out..! this works on my machine
   
v2
Comments
asbis 16-Nov-12 8:10am
   
Hi Ravi
which browser you are using for this?
Bcz im using iE7 and it not working for me
:(
Rate this:
Please Sign up or sign in to vote.

Solution 2

I tested a sample html page with your said requirement and executed in IE7. I created the page in jsfiddle. Check the following URL.

http://jsfiddle.net/aF2jU/2/

I am able to run it in IE7.
   
Comments
asbis 16-Nov-12 8:11am
   
I am also using same IE7 ,but still it is not working for me :(
Rate this:
Please Sign up or sign in to vote.

Solution 3

HI Jyotish Pillai

http://jsfiddle.net/aF2jU/2/

i have used this code but, still it is not working for me in IE7
   
Rate this:
Please Sign up or sign in to vote.

Solution 4

Try this Code its working fine.

$(this).data('stored-value', selectedVal); //set new selected value

                var eleid = $(this).attr("id");


$("[id*='ListBox']").each(function () {
if ($(this).attr("id") !== eleid) {
$(this).find('option[value="' + selectedVal + '"]:not(:selected)').attr('disabled', 'disabled');
}
});


<asp:listbox id="ListBox1" runat="server" width="196px" cssclass="ddlselect" xmlns:asp="#unknown">
           <asp:listitem>1</asp:listitem>
        <asp:listitem>2</asp:listitem>
        <asp:listitem>3</asp:listitem>
        <asp:listitem>4</asp:listitem>
        <asp:listitem>5</asp:listitem>
        <asp:listitem>6</asp:listitem>
        <asp:listitem>7</asp:listitem>
        <asp:listitem>8</asp:listitem>
        <asp:listitem>9</asp:listitem>
        <asp:listitem>10</asp:listitem>
        </asp:listbox>
        <asp:listbox id="ListBox2" runat="server" width="196px" cssclass="ddlselect" xmlns:asp="#unknown">
           <asp:listitem>1</asp:listitem>
        <asp:listitem>2</asp:listitem>
        <asp:listitem>3</asp:listitem>
        <asp:listitem>4</asp:listitem>
        <asp:listitem>5</asp:listitem>
        <asp:listitem>6</asp:listitem>
        <asp:listitem>7</asp:listitem>
        <asp:listitem>8</asp:listitem>
        <asp:listitem>9</asp:listitem>
        <asp:listitem>10</asp:listitem>
        </asp:listbox>
        <asp:listbox id="ListBox3" runat="server" width="196px" cssclass="ddlselect" xmlns:asp="#unknown">
           <asp:listitem>1</asp:listitem>
        <asp:listitem>2</asp:listitem>
        <asp:listitem>3</asp:listitem>
        <asp:listitem>4</asp:listitem>
        <asp:listitem>5</asp:listitem>
        <asp:listitem>6</asp:listitem>
        <asp:listitem>7</asp:listitem>
        <asp:listitem>8</asp:listitem>
        <asp:listitem>9</asp:listitem>
        <asp:listitem>10</asp:listitem>
        </asp:listbox>
   
Comments
asbis 21-Nov-12 0:22am
   
Still it is not wrorking for me in IE7
Actualy i have to use Dropdownlist instead of listbox.

Any idea why it is not working for me?
deepak.m.shrma 21-Nov-12 0:50am
   
hey buddy have you seen any dropdown list item disable. not naah.. cou can't, yaa you can show msg while a user select selected value. or reset when he select that value again.. in dropdown meaning itself its dropable items list :-) i hope you will get my point.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100