Skip to end of metadata
Go to start of metadata

WebGrid 10 is a major release that sports a completely redesigned user interface based on the new Unified Theming framework introduced in the WebUI Studio 2016 release. Building on its advanced functionalities, WebGrid 10 leverages the latest web technologies and front-end trends optimized for modern browsers like Chrome, Safari, and Edge. The new WebGrid lets you rapidly add powerful data presentation to your ASP.NET web project with simple drag-drop, while delivering beautiful design that naturally suitable to modern web applications today.

At the core, WebGrid undergoes fundamental architectural changes by minimizing server-side dependencies and strongly focusing on client-side capabilities, allowing it to rapidly evolve with the advancement of web technologies. This release adds full support for external CSS frameworks such as Bootstrap and Foundation. Unlike the previous versions, every WebGrid element is now style-able through CSS, including static, dynamic and interactive elements. 

More importantly, this release adds a new modern theme that you can apply with the simplicity of xcopy. Beyond just basic styling, the modern theme includes comprehensive styling for more than hundreds of UI elements available in WebGrid. In addition, this release provides full support for latest major browsers including Internet Explorer 11, Edge, Safari for Mac, Chrome 47 and Firefox 42.

Download WebGrid 10 today.


This page guides you through the new features and enhancements available in WebGrid 10. Click the links below to jump to the section of your interest.


Unified Theming Support

In this release, WebGrid has been significantly enhanced to fully support unified theming capability introduced in WebUI Framework 4. In general, these are the key area of improvements to support unified theming:

  • Inline styles are now removed in favor to CSS styles which reduce markup and page output in overall.
  • Instance-level styles and default stylesheets are no longer rendered, enabling the page to load much faster.
  • Provide attribute-based states for streamlined styling through CSS3 selectors.
  • Enhanced both server-side and client-side rendering to support modern HTML5 and CSS3 markup/syntax.

For more information, see Unified Theming.

New Unified Modern Theme

One of the biggest updates in this release is the introduction of brand-new modern theme for WebGrid. Building on the new unified theming framework, WebGrid's new theme leverages the most popular CSS framework, Bootstrap. Unlike previous versions, WebGrid automatically uses shared/common styles when the unified theming feature is enabled. When the common styles are modified, WebGrid and the other WebUI components that present similar semantic will be automatically updated.

At a glance, the WebGrid modern theme key highlights are:

  • Based on Bootstrap 3.3
  • Written in SCSS language
  • Redesigned with clean and modern styles
  • Meticulously designed, pixel-perfect styling on over 100+ elements and editors
  • Control resources now use scalable vector graphic (SVG) in favor to low-res images
  • Includes 150+ SVG icons designed exclusively for WebUI Studio

The following screenshot shows a basic WebGrid in action with the new modern theme.

70% less footprint when using hierarchical Grid. WebGrid now renders a super lightweight markup for expand and collapse indicator, as well as to the entire hierarchy indicators.

For more information about the theme features and how to apply the theme in your web projects, see WebGrid Theming Overview. To see the complete style reference available in the Modern Theme, see WebGrid Modern Theme Style Reference.

ColumnSet Designer

WebGrid 10 improved the web development experience further by bringing ColumnSet Designer to the WebGrid component editor for Visual Studio 2012 or higher. The designer also works perfectly when used in hi-dpi resolution display, including all interactivity such as drag-to-resize and ColumnSet automatic width calculation.

For more information about ColumnSet feature, see WebGrid ColumnSet.

Improved Data Editing Reliability

Data editing is one of the most fundamental functions in WebGrid. In this release, the data editing experience such as inline editing and keyboard navigation has been further perfected, allowing users to work with data in more natural and productive way.

In general, many improvements have been around these particular areas:

  • Editing mode, particularly the inline editing experience.
  • More accurate editors positioning optimized for modern browsers.
  • Keyboard navigation when using arrow keys, Tab and Shift+Tab.
  • Synchronized cell focus and scrolling state.

To learn more about data editing in WebGrid, see Editing Data.

Improved Data Filtering Experience

In addition to many runtime enhancements, WebGrid 10 also includes a redesigned filter bar that is more responsive and works identically across major modern browsers.

To learn more about data filtering in WebGrid, see Filtering Data.

Improved Interaction Performance

In previous versions, when the page containing WebGrid has a lot of stylesheet classes, interaction such as row selection will become slower as more stylesheets are included. This release includes major re-engineering to the interaction core, resulting in real-time interaction regardless of the stylesheet size. This improvement is instrumental in creating responsive user experience for large-scale WebUI application.

Latest Browser Support

WebGrid 10 has been significantly improved to support the following browsers:

  • Internet Explorer 11
  • Edge
  • Safari Mac 9.0
  • Chrome 48
  • Firefox 44


Updates and fixes in this release

This release includes the following updates and bug fixes:

T Key Summary P Status Component/s
Improvement ASPNET-420 Auto resizing with best fit now covers padding and space when CSS framework is enabled. Major Resolved WebGrid
Bug ASPNET-419 Fixed incorrect column action dropdown position when using CSS Framework Major Resolved WebGrid
Bug ASPNET-418 Update failed when the cell has "<" character and TreatMarkupAsLiteralText is enabled. Major Resolved WebGrid
Bug ASPNET-417 Enhancement: Keyboard navigation support for non IE browser Major Resolved
Improvement ASPNET-416 Support for Chrome 57 and Firefox 52 browsers. Major Closed WebGrid
Bug ASPNET-408 Fix column headers and rows of the grid gets mis-aligned when double click on any column to expand the width Major Resolved
Bug ASPNET-406 Fix: Auto resize column's width causing sorting applied to the next column Major Resolved
Bug ASPNET-362 WebGrid Designer becomes inaccessible when using hierarchical structure Major Resolved
Bug ASPNET-357 When using Unified Theming, WebGrid is unable to complete add new row process in hierarchical mode. Major Resolved WebGrid
Bug ASPNET-354 Ready status text doesn't show on non IE browsers when using client-side binding. Major Resolved WebGrid
Bug ASPNET-317 Required scripts aren't loaded properly when certain cultures are used such as Turkish. This issue affects IE11 browser only. Major Resolved WebGrid
New Feature ASPNET-312 Improved reliability for WebGrid with Hierarchical configuration. Major Closed
New Feature ASPNET-311 Major improvements for Safari Mac, synchronized scrolling during keyboard and mousewheel interaction. Major Closed
New Feature ASPNET-310 Horizontal scrollbar in Safari is now visible when column freezing is enabled. Major Closed
New Feature ASPNET-309 Addressed various issues related to control focus, editing, and keyboard navigation. Major Closed
New Feature ASPNET-308 Better support for scenarios in scrollable page, yielding consistent control positioning and presentation Major Closed
New Feature ASPNET-307 Major stability improvements to produce identical rendering and user experience across modern browsers, including IE11, Edge, Safari 9, Chrome 45, and Firefox 42. Major Closed
New Feature ASPNET-306 Re-engineered column freezing algorithm with more efficient API available in modern browsers Major Closed
New Feature ASPNET-305 Improved client binding support for real-time grouping and ungrouping rendering Major Closed
New Feature ASPNET-304 Improved table header rendering in a child table to accurately align with its width Major Closed
New Feature ASPNET-303 Resizing column of a child table now invalidates the Grid's scroll bar for best fit Major Closed
New Feature ASPNET-302 Improved table layout and rendering to be consistent across major browsers (columns not aligned when scroll to the most right edge of the Grid) Major Closed
New Feature ASPNET-301 Status bar element now consistently docked at the bottom edge of the Grid Major Closed
New Feature ASPNET-300 Lost focus style is causing appearance problems to bottom borders in certain browsers Major Closed
New Feature ASPNET-299 Edit focus color is now re-applied after the Grid gained focus Major Closed
New Feature ASPNET-298 Table body height is now recalculated when filter bar is hidden from context menu Major Closed
New Feature ASPNET-297 Major rework on client-side API to work with CSS classes, resulting in 4x faster performance. Major Closed
New Feature ASPNET-296 Editing controls are now positioned perfectly to the cell boundary when using background highlight type Major Closed
New Feature ASPNET-295 Filter UI state is now accurately persisted when user cancelled the changes by focusing on another elements Major Closed
New Feature ASPNET-294 Redesigned filter bar with CSS3-based selectors for more versatile interface and layout across all browsers Major Closed
New Feature ASPNET-293 Improved keyboard navigation consistency and inline cell editing in Microsoft Edge Major Closed
New Feature ASPNET-292 Column sort indicator is now always visible when the column caption length exceeds its width. Major Closed
Bug ASPNET-226 Maintain filter text when edited filter textbox lost focus Major Closed
Task ASPNET-196 Unified modern style for WebGrid Major Closed
Improvement ASPNET-190 Support IE11 compatibility mode when the X-UA-Compatible meta tag is set to Edge. Major Closed WebGrid
Improvement ASPNET-185 Improve WebGrid Performance when binding to large data and paging is not enabled. Major Closed

Since WebGrid 10 is a major release, the WebGrid updates are not available via Update Manager channel. Please install from the latest setup for the best development experiences which includes new project templates and other IDE enhancements.