New to Telerik UI for ASP.NET Core? Download free 30-day trial

Adaptive Rendering

Loading Demo...
  • EXAMPLE
  • VIEW SOURCE
  • EDIT IN TELERIK REPL
  • Change Theme
    default

    Themes & Swatches

    SASS
    LESS
    Launch Theme Builder
    Default Theme
    • Main
    • Main Dark
    • Nordic
    • Ocean Blue
    • Purple
    • Turquoise
    Bootstrap Theme
    • Main
    • Main Dark
    • Nordic
    • Urban
    • Vintage
    Material Theme
    • Main
    • Arctic
    • Lime Dark
    • Main Dark
    • Nova
    Classic Theme
    • Main
    • Main Dark
    • Opal
    • Silver
HtmlHelper
TagHelper
Files:
adaptive_rendering.cshtml
Adaptive_RenderingController.cs
ProductService.cs
ProductViewModelGridPopUp.cs
Adaptive_Rendering_TagHelper.cshtml

Also available for:

CLIENT-SIDE API SERVER-SIDE API

Description

You can enable the Adaptive Mobile Rendering for the Grid via a simple configuration setting. All you have to do is set its mobile attribute to true. This will make the column menu, filter menu and popup edit form slide in a new screen for the user. To force the mobile rendering, regardless of browser type, set the configuration to phone.

The column resizing feature on touch screen devices is triggered when the user holds a finger on the respective column header. When the resizing icon appears, the user can resize the column by dragging.

More information regarding Grid Adaptive Rendering can be found in the documentation here.

Support & Learning Resources