Changing page size when using client-side databinding results in column settings not being applied.

[Eric Means]

I'm seeing an issue with a RadGrid using client-side databinding where if the user changes the page size using the dropdown in the paging footer, the additional rows don't get some of the column settings (like horizontal alignment, CSS class, etc) that they should.

The grid is set up like so:

<telerik:RadGrid runat="server" ID="RadGrid1" AutoGenerateColumns="false"
    Width="100%" GridLines="None" PageSize="5" AllowFilteringByColumn="true" AllowPaging="true"
    AllowSorting="true">
    <MasterTableView EnableViewState="False" EnableNoRecordsTemplate="true" IsFilterItemExpanded="false">
        <NoRecordsTemplate>
            There are no available records.
        </NoRecordsTemplate>
        <RowIndicatorColumn>
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>
        <ExpandCollapseColumn>
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>
        <Columns>
            <telerik:GridHyperLinkColumn SortExpression="Name" ItemStyle-CssClass="gridLink" ItemStyle-Wrap="true" HeaderText="Description"
                UniqueName="Name" DataTextField="Name" FilterControlWidth="55px" CurrentFilterFunction="Contains">
            </telerik:GridHyperLinkColumn>
            <telerik:GridDateTimeColumn AllowFiltering="true" AllowSorting="true"
                ItemStyle-Wrap="false" DataField="DueDate" DataFormatString="{0:M/d/yyyy}" HeaderText="Scheduled"
                UniqueName="DueDate" ItemStyle-Width="85" HeaderStyle-HorizontalAlign="Right"
                ItemStyle-HorizontalAlign="Right" CurrentFilterFunction="GreaterThanOrEqualTo">
            </telerik:GridDateTimeColumn>
            <telerik:GridDateTimeColumn AllowFiltering="true" AllowSorting="true"
                ItemStyle-Wrap="false" DataField="DoneDate" DataFormatString="{0:M/d/yyyy}" HeaderText="Done"
                UniqueName="DoneDate" ItemStyle-Width="55" HeaderStyle-HorizontalAlign="Right"
                ItemStyle-HorizontalAlign="Right" CurrentFilterFunction="GreaterThanOrEqualTo">
            </telerik:GridDateTimeColumn>
        </Columns>
    </MasterTableView>
    <PagerStyle Mode="NextPrevAndNumeric" />
    <ClientSettings>
        <ClientEvents
            OnDataBinding="RadGrid1_OnDataBinding"
            OnDataBound="RadGrid1_OnDataBound"
            OnRowDataBound="RadGrid1_OnRowDataBound"
            OnDataBindingFailed="RadGrid1_OnDataBindingFailed" />
        <DataBinding Location="~/Services/RadGrid1Service.svc" SelectMethod="GetRadGrid1Data" SortParameterType="String" FilterParameterType="String">
        </DataBinding>
    </ClientSettings>
</telerik:RadGrid>

I have attached a screenshot showing the problem (rows 6 and on do not have the Scheduled date right-aligned; they also do not get the gridLink CSS class on the Description column).

Is this a known issue/is there a workaround? I've looked at the OnRowDataBound method and it's not doing anything that should interfere with this as far as I know -- all it does is conditionally add a CSS class (using jQuery.addClass) to the Scheduled column if the date is in the past.




 

[Nikolay Rusev]

Hello Eric,

This is expected behavior. RadGrid will not recreate ItemStyle which is set on server when increase items count on client side.

You can handler OnRowDataBound and within the arguments apply the styles in question.

Best wishes,
Nikolay
the Telerik team

[Vsoni]

function

radGrid_OnRowDataBound(sender, args) {

// Changes to nowrap Date column if page size gets changed

if(args.get_item().get_element().style.whiteSpace == "")

args.get_item().get_element().style.whiteSpace = "nowrap";
}

Like that you can apply any style to ur rows on page size change