RadGrid - style changing on Rebind?

[Craig]

Hello,

 

Having a bit of an odd issue where the styling is changing on a RadGrid after rebinding. To begin with its starting with the first row rendered above the bottom of the header row - which isn't ideal as well as showing a blank footer bar. Afterwards the top row is rendered correctly under the header row and the blank footer bar has disappeared.

 

Any idea what this could be?

Images attached and code below: -

 

<div style="horiz-align: center">
            <span style="text-align: center; font-size: large; padding-bottom: 15px;">Please select the relevant campaign: -</span>
            <div style="padding-bottom: 5px;">Search Campaigns: <asp:TextBox ID="CampaignFilter" AutoPostBack="true" runat="server"/><span style="padding-left: 5px;"><asp:button runat="server" Text="Search" id="SearchButton" OnClick="SearchButtonOnClick" /></span></div>
            <telerik:RadGrid ID="CampaignGrid" runat="server" OnNeedDataSource="CampaignGridNeedDataSource"
                AllowPaging="False" Skin="WebBlue" Height="350px">
                <ClientSettings EnableRowHoverStyle="True" Scrolling-UseStaticHeaders="True" Scrolling-AllowScroll="True">
                    <ClientEvents OnRowClick="CampaignRowClicked" />
                </ClientSettings>
                <MasterTableView AutoGenerateColumns="False" AllowSorting="False" AllowFilteringByColumn="False" TableLayout="Fixed">
                    <Columns>
                        <telerik:GridTemplateColumn DataField="Name" SortExpression="Name" HeaderText="Campaign Name" UniqueName="Name">
                            <ItemTemplate>
                                <div class="TableCellNoOverflow" id="CampaignName"><%# Eval("Name") %></div>
                                <asp:HiddenField runat="server" ID="HdnCampaignId" Value='<%# Eval("Id") %>'/>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>
                    </Columns>
                </MasterTableView>
            </telerik:RadGrid>
        </div>

 

 

protected void CampaignGridNeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
        List<DataRow> campaigns = Campaigns.AsEnumerable().ToList();
        campaigns = campaigns.Where(r => ((string) r["Name"]).ToUpper().Contains(CampaignFilter.Text.ToUpper())).ToList();
        if(campaigns.Count > 0)
            CampaignGrid.DataSource = campaigns.CopyToDataTable();
        else
        {
            DataTable dt = new DataTable();
            dt.Columns.Add("Name");
            CampaignGrid.DataSource = dt;
        }
    }

    protected void SearchButtonOnClick(object sender, EventArgs e)
    {
        CampaignGrid.Rebind();
    }

 

[Craig]

As a further bit of information it seems that the CampaignGrid_GridData div component of the rad grid with class rgDataDiv is computing its height differently each time. Which seems mildly strange. On initial load its loading at 300px but after the Ajax postback caused by the search box its coming out at the preferable 324px.

On the other hand blanking the search then results in the same issue without having to reload the whole page.

[Maria Ilieva]

Hello Craig,

The presented code looks correct to me and there is no obvious reason for the issue you are facing. I suppose that some js error might appear on the page and it can prevent the RadGrid control for properly calculating its height. Can you please inspect the response on load in the browser's console and see if any errors appear?
Also if you have any custom client code please try to call repaint() for the RadGrid on load and see how it goes.

Regards,
Maria Ilieva
Telerik