In my website i have a grid with very large amount of data.
To reduce the loading time of the page i used client side binding (Using JSON) .
I have also enabled GZIP in the server to zip the JSON respnse .But the grid is taking more time to rendering the data,
Is there any way to reduce this?
How can i enable paging and virtual scrolling in this grid?
Code
SampleService.GetData(search, onComplete, onFailed);
function onComplete(resultObject) {
var tableView = $find("ctl00_ContentPlaceHolder_rgSearchResult_ctl00");
tableView.set_dataSource(resultObject);
tableView.dataBind();
return false;
}
<telerik:RadGrid ID="rgSearchResult" runat="server" Width="100%" AllowFilteringByColumn="True"
AllowSorting="True" AutoGenerateColumns="False" GridLines="None" AllowPaging="True"
OnNeedDataSource="rgSearchResult_NeedDataSource" PageSize="50" AllowMultiRowSelection="True"
OnPageIndexChanged="rgSearchResult_PageIndexChanged" ShowStatusBar="True" EnableViewState="False"
CssClass="gridHome">
<MasterTableView Width="100%" AutoGenerateColumns="false" AllowFilteringByColumn="True"
EnableViewState="False">
<RowIndicatorColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</RowIndicatorColumn>
<ExpandCollapseColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</ExpandCollapseColumn>
<Columns>
-----------
-----------
-----------
</Columns>
</MasterTableView>
<ClientSettings Scrolling-AllowScroll="true" Scrolling-ScrollHeight="500px">
<DataBinding EnableCaching="True">
</DataBinding>
<Scrolling UseStaticHeaders="true" />
</ClientSettings>
</telerik:RadGrid>
To reduce the loading time of the page i used client side binding (Using JSON) .
I have also enabled GZIP in the server to zip the JSON respnse .But the grid is taking more time to rendering the data,
Is there any way to reduce this?
How can i enable paging and virtual scrolling in this grid?
Code
SampleService.GetData(search, onComplete, onFailed);
function onComplete(resultObject) {
var tableView = $find("ctl00_ContentPlaceHolder_rgSearchResult_ctl00");
tableView.set_dataSource(resultObject);
tableView.dataBind();
return false;
}
<telerik:RadGrid ID="rgSearchResult" runat="server" Width="100%" AllowFilteringByColumn="True"
AllowSorting="True" AutoGenerateColumns="False" GridLines="None" AllowPaging="True"
OnNeedDataSource="rgSearchResult_NeedDataSource" PageSize="50" AllowMultiRowSelection="True"
OnPageIndexChanged="rgSearchResult_PageIndexChanged" ShowStatusBar="True" EnableViewState="False"
CssClass="gridHome">
<MasterTableView Width="100%" AutoGenerateColumns="false" AllowFilteringByColumn="True"
EnableViewState="False">
<RowIndicatorColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</RowIndicatorColumn>
<ExpandCollapseColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</ExpandCollapseColumn>
<Columns>
-----------
-----------
-----------
</Columns>
</MasterTableView>
<ClientSettings Scrolling-AllowScroll="true" Scrolling-ScrollHeight="500px">
<DataBinding EnableCaching="True">
</DataBinding>
<Scrolling UseStaticHeaders="true" />
</ClientSettings>
</telerik:RadGrid>