<optgroup> Not working in jQuery Dropdown

Posted by Santhosh Kumar on Stack Overflow See other posts from Stack Overflow or by Santhosh Kumar
Published on 2012-09-28T11:27:29Z Indexed on 2012/09/28 15:38 UTC
Read the original article Hit count: 304

Filed under:
|
|
|
|

I have a asp:dropdownlist which i have changed to jQuery multiselect. I have to group the data inside the dropdown. I am grouping this in runtime.If it is a normal asp dropdown its working. When applying jquery Multiselect its dosen't.

Source:

<link rel="stylesheet" type="text/css" href="Styles/jquery.multiselect.css" />
    <link rel="stylesheet" type="text/css" href="Styles/jquery.multiselect.filter.css" />
    <link rel="stylesheet" type="text/css" href="Styles/style.css" />
    <link rel="stylesheet" type="text/css" href="Styles/prettify.css" />
    <%--<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>--%>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
    <script type="text/javascript" src="Scripts/jquery.multiselect.js"></script>
    <script type="text/javascript" src="Scripts/jquery.multiselect.filter.js"></script>
    <script type="text/javascript" src="Scripts/prettify.js"></script>

 <script type="text/javascript">
        $(document).ready(function () {
            //Create groups for dropdown list
            $("option[classification='LessThanFive']").wrapAll("<optgroup label='Less Than Five' />");
            $("option[classification='GreaterThanFive']").wrapAll("<optgroup label='Greater Than five' />");
        });

    </script>

 <asp:DropDownList ID="MobileData" runat="server" OnDataBound="ddl_DataBound">
            </asp:DropDownList>

//Code Behind:

protected void ddl_DataBound(object sender, EventArgs e)
    {
        foreach (ListItem item in ((DropDownList)sender).Items)
        {

            if (System.Int32.Parse(item.Value) < 2)
                item.Attributes.Add("classification", "LessThanFive");
            else
                item.Attributes.Add("classification", "GreaterThanFive");

        }

    }

  protected void Page_Load(object sender, EventArgs e)
    {
          ListItemCollection list = new ListItemCollection();     
           list.Add(new ListItem("1", "1"));
           list.Add(new ListItem("2", "2"));
           list.Add(new ListItem("3", "3"));
           list.Add(new ListItem("4", "4"));
           list.Add(new ListItem("5", "5"));
           list.Add(new ListItem("6", "6"));
           list.Add(new ListItem("7", "7"));
           list.Add(new ListItem("8", "8"));
           list.Add(new ListItem("9", "9"));
           list.Add(new ListItem("10", "10"));

           MobileData.DataSource = list;
           MobileData.DataBind();
   }

Where i'm wrong?

© Stack Overflow or respective owner

Related posts about c#

Related posts about jQuery