Remove an option from MultiSelect DropDownList based on options text or value using jQuery in ASP.Net

EmadKhan

SOLVED CLOSED ACTIVE ANSWERED
User: EmadKhan
Posted: on Mar 21, 2017 03:15 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 12166
Sample Code: Download

My asp.net listbox is having multiple selection enabled and i have binded it with jQuery multislect plugin , as you can see it in picture that after it is being instantiated with plugin it also shows its original state, which is not expected behaviour.

Download FREE API for Word, Excel and PDF in ASP.Net

dharmend...

0 1

Reply
User: dharmendr
Replied: on Mar 21, 2017 03:16 AM
Report

Hi EmadKhan,

Refer the below article.

EmadKhan

0 2

Reply
User: EmadKhan
Replied: on Mar 21, 2017 05:28 AM
Report

Please understand my problem, It is related with listbox showing issue. While it is instantiated it is still showing its original state.

dharmend...

0 3

Reply
User: dharmendr
Replied: on Mar 21, 2017 06:17 AM
Report

Hi EmadKhan,

Please provide complete details. Your html and code with the plugin you are using.

EmadKhan

0 4

Reply
User: EmadKhan
Replied: on Mar 21, 2017 07:00 AM
Report

 <asp:ListBox SelectionMode="Multiple"  ID="DailyLogWeekRangeDrp" runat="server" Width="100%">
 </asp:ListBox>

<script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js"
        type="text/javascript"></script>

<script type="text/javascript">
  $(function () {
     $('[id*=DailyLogWeekRangeDrp]').multiselect();
     $("#bodyHolder_DailyLogWeekRangeDrp option[value='-1']").remove();
});
</script>

dharmend...

0 5

Reply
ANSWER
User: dharmendr
Replied: on Mar 21, 2017 07:36 AM
Report

Hi EmadKhan,

Refer the below sample.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" />
    <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css" />
    <script type="text/javascript" src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js"></script>
    <script type="text/javascript">
        $(function () {
            $("[id*=DailyLogWeekRangeDrp] option[value='-1']").remove();
            $('[id*=DailyLogWeekRangeDrp]').multiselect();
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <select size="4" name="DailyLogWeekRangeDrp" multiple="multiple" id="DailyLogWeekRangeDrp">
            <option value="-1">ALL DATES: 23-NOV-2015 TO 26-MAR-2017</option>
            <option value="2">WEEK 1: 23-NOV-2015 TO 29-NOV-2015</option>
            <option value="3">WEEK 2: 30-NOV-2015 TO 06-DEC-2015</option>
            <option value="4">WEEK 3: 07-DEC-2015 TO 13-DEC-2015</option>
            <option value="5">WEEK 4: 14-DEC-2015 TO 20-DEC-2015</option>
            <option value="6">WEEK 5: 21-DEC-2015 TO 27-DEC-2015</option>
        </select>
    </div>    
    </form>
</body>
</html>

Demo

Aspx ListBox

<asp:ListBox SelectionMode="Multiple" ID="DailyLogWeekRangeDrp" runat="server" Width="100%">
    <asp:ListItem Text="ALL DATES: 23-NOV-2015 TO 26-MAR-2017" Value="-1" />
    <asp:ListItem Text="WEEK 1: 23-NOV-2015 TO 29-NOV-2015" Value="2" />
    <asp:ListItem Text="WEEK 2: 30-NOV-2015 TO 06-DEC-2015" Value="3" />
    <asp:ListItem Text="WEEK 3: 07-DEC-2015 TO 13-DEC-2015" Value="4" />
    <asp:ListItem Text="WEEK 4: 14-DEC-2015 TO 20-DEC-2015" Value="5" />
    <asp:ListItem Text="WEEK 5: 21-DEC-2015 TO 27-DEC-2015" Value="6" />
</asp:ListBox>

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Remove an option from MultiSelect DropDownList based on options text or value using jQuery in ASP.Net

Multiple Select (MultiSelect) DropDownList with CheckBoxes in ASP.Net using jQuery

Company

Explore

Follow us

Contact Us