Images in Header template

[Harsh]

Hi

I need to add image in each header template  in GridTemplateColumn
But the images vanishes whenever I hit on the header for sorting

<telerik:RadGrid ID="rdAdminApproval" Skin="RadSkin" CssClass="ExportGrid" EnableEmbeddedSkins="false"
        Width="100%" mygv="" AllowFilteringByColumn="true"  AllowSorting="true"
        PageSize="10" AllowPaging="true" Font-Size="7pt" runat="server" GridLines="Horizontal"
        ShowGroupPanel="false" CellPadding="0" CellSpacing="0" >
        <%--<GroupingSettings CaseSensitive="false" />--%>
        <MasterTableView SkinID="RadSkin"  AutoGenerateColumns="false" AllowFilteringByColumn="false"
            FilterItemStyle-Wrap="true"  UseAllDataFields="true">
            <SortExpressions>
                <telerik:GridSortExpression FieldName="str1" SortOrder="Ascending" />
            </SortExpressions>
            <Columns>

                <telerik:GridTemplateColumn AllowFiltering="false"  >
                <HeaderTemplate>
                <img src="sort.png" />
                </HeaderTemplate>
                    <ItemTemplate>
                         <asp:Label runat="server" Text='<%#Eval("str")%>'></asp:Label>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
                <telerik:GridTemplateColumn   ShowSortIcon="true"    SortDescImageUrl="SortDown.png" SortAscImageUrl="SortUp.png">
                    <HeaderTemplate>
                        <img src="sort.png" />
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:Label ID="Label1" runat="server" Text='<%#Eval("str1")%>' ></asp:Label>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
                <telerik:GridTemplateColumn AllowFiltering="false">
                    <HeaderTemplate>
                        <img src="sort.png" />
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:Label ID="Label2" runat="server" Text='<%#Eval("str2")%>'></asp:Label>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>

            </Columns>
        </MasterTableView>
        <FilterMenu EnableImageSprites="False">
        </FilterMenu>
    </telerik:RadGrid>

[Princy]

Hi Harsh,

I tried your program,but i got the same output,but then i tried it creating programatically,and the header picture was persisting.So i suggest you try setting it programmatically.Please check this documentation.
Here is what i have tried.

C#:

protected void Page_Init(object sender, EventArgs e)
{
    RadGrid grid = new RadGrid();
    grid.AutoGenerateColumns = false;
    grid.DataSourceID = "SqlDataSource2";
    grid.AllowSorting = true;
    string templateColumnName = "ShipCountry";
    GridTemplateColumn templateColumn = new GridTemplateColumn();
    templateColumn.ItemTemplate = new MyTemplate(templateColumnName);
    templateColumn.HeaderText = templateColumnName;
    templateColumn.HeaderImageUrl = "~/Image/free-vector-arrow-icons_f.jpg";
    templateColumn.SortExpression = "ShipCountry";
    templateColumn.SortAscImageUrl = "~/Image/up.jpg";
    templateColumn.SortDescImageUrl = "~/Image/Down-Arrow-Photo.png";
    grid.MasterTableView.Columns.Add(templateColumn);
    grid.AllowPaging = true;
    grid.PageSize = 5;
    PlaceHolder1.Controls.Add(grid);
}
private class MyTemplate : ITemplate
{
    protected LiteralControl lControl;
    private string colname;
    public MyTemplate(string cName)
    {
        colname = cName;
    }
    public void InstantiateIn(System.Web.UI.Control container)
    {
        lControl = new LiteralControl();
        lControl.ID = "lControl";
        lControl.DataBinding += new EventHandler(lControl_DataBinding);

        Table table = new Table();
        TableRow row1 = new TableRow();

        TableCell cell11 = new TableCell();
        TableCell cell12 = new TableCell();
        row1.Cells.Add(cell11);
        row1.Cells.Add(cell12);
        table.Rows.Add(row1);
        cell12.Controls.Add(lControl);
        container.Controls.Add(table);
        container.Controls.Add(new LiteralControl("<br />"));

    }

    public void lControl_DataBinding(object sender, EventArgs e)
    {
        LiteralControl l = (LiteralControl)sender;
        GridDataItem container = (GridDataItem)l.NamingContainer;
        l.Text = ((DataRowView)container.DataItem)[colname].ToString() + "<br />";
    }
}

Thanks,
Princy