images in dropdownlist inside gridview using jquery in asp.net

See more:

C#

ASP.NET

Javascript

jQuery

, +

I am trying to add images in dropdownlist control which is inside gridview. I've used jquery to achieve this. The problem is images are not loading in dropdownlist when i use it inside gridview, but when i use it outside gridview, its working. I am using master pages & update panel if this info is required. Here's the code

JavaScript

<script type="text/javascript" language="javascript">
$(document).ready(function (e) {
    InitializeDDL();
});

function InitializeDDL() {
    try {
        $('#<%=GridProcessFlow.ClientID %>').find('.clsddl').msDropDown();
    } catch (e) {
       alert(e.message);
    }
}
</script>

I am calling javascript function in aspx itself inside update panel to load dropdownlist data

aspx

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <script type="text/javascript">
            Sys.Application.add_load(InitializeDDL);
        </script>
        <asp:Panel ID="pnlTabBoxProcess" runat="server">
            <asp:GridView ID="GridProcessFlow" runat="server" OnRowCommand="GridProcessFlow_RowCommand" OnRowDataBound="GridProcessFlow_RowDataBound">
                <Columns>
                    <asp:TemplateField HeaderText="Legends" ItemStyle-CssClass="WrappedText">
                        <ItemTemplate>
                            <asp:DropDownList ID="ddlLegends" runat="server" Width="100px" AutoPostBack="false" OnSelectedIndexChanged="ddlLegends_SelectedIndexChanged" CssClass="clsddl"></asp:DropDownList>
                        </ItemTemplate>
                    </asp:TemplateField>
            </asp:GridView>
        </asp:Panel>
    </ContentTemplate>
</asp:UpdatePanel>

Code Behind aspx.cs

protected void GridProcessFlow_RowDataBound(object sender, GridViewRowEventArgs e) {
    DropDownList ddlLegends = (DropDownList) e.Row.FindControl("ddlLegends");
    SqlConnection con = new SqlConnection("Data Source=.;Initial Catalog=MySampleDB;Integrated Security=true");
    con.Open();
    SqlCommand cmd = new SqlCommand("select * from Legends", con);
    SqlDataAdapter da = new SqlDataAdapter(cmd);
    DataSet ds = new DataSet();
    da.Fill(ds);
    ddlLegends.DataSource = ds;
    ddlLegends.DataValueField = "LegendImage";
    ddlLegends.DataTextField = "Legend";
    ddlLegends.DataBind();
    if (ddlLegends != null) {
        foreach(ListItem li in ddlLegends.Items) {
            li.Attributes["title"] = "Images/Legends/" + li.Value;
        }
    }
}