RadGrid for ASP.NET AJAX

RadControls for ASP.NET AJAX

Often, when constructing a Web page that contains a grid, there are design limitations regarding the size of the grid. In such cases, you may need to enable client-side grid scrolling so that the grid can fit it in the allowed space. You can enable scrolling by setting the ClientSettings.Scrolling.AllowScroll property to True (By default its value is False.)

Note

The ClientSettings.Scrolling.ScrollHeight property specifies the height value beyond which scrolling is turned on. The default value is 300px.

When scrolling is enabled, scroll bars appear on the grid when the number of records it displays would cause it to exceed the value of ScrollHeight:

When scrolling is not enabled, the entire grid appears in the Web page. Users must scroll the Web page instead:

Scrolling disabled

RadGrid enhances the simple scrolling by supporting static headers and frozen columns - you can scroll the grid data while the header row always stays visible at the top. Furthermore, there is virtual scrolling option that fetches only specified range of records to be visualized on the current page.

Appearance

You can modify the way RadGrid looks during scrolling by modifying the following CSS classes (the "_Default" suffix should be replaced with the name of the skin that you are using):

  • GridHeaderDiv_Default - for controlling the appearance of the GridHeaderItem
  • GridDataDiv_Default - for controlling the appearance of the GridDataItem
  • GridFooterDiv_Default - for controlling the appearance of the GridFooterItem