This topic explains how to configure WebGrid to emit HTML5 compliance output.

Configure Doc Type

Each doctype declaration in HTML specification produces different results and behaviors, mostly in the layout and rendering aspects. WebGrid supports most commonly used doctype and automatically adjust the behaviors and rendering results by detecting the doctype declaration of the HTML page.

In version 8, WebGrid has been significantly enhanced to deliver consistent behaviors and layout in HTML5 pages. All features should work exactly as in other doctype.

To enable HTML5 support in WebGrid, make sure you have configured the HTML pages to use the proper doctype. The standard doctype for HTML5 is <!DOCTYPE html>.

The following code example shows how to use WebGrid in a simple WebForm using HTML5 doctype.

ASPX	Copy Code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="cs_WebGrid_Default" %> <%@ Register Assembly="ISNet.WebUI.WebGrid" Namespace="ISNet.WebUI.WebGrid" TagPrefix="ISWebGrid" %> <!DOCTYPE html> <html> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <ISWebGrid:WebGrid ID="WebGrid1" runat="server" Height="300px" DataSourceID="AccessDataSource1"> </ISWebGrid:WebGrid> <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/NorthWind.mdb" SelectCommand="SELECT TOP 20 * FROM [Orders]"></asp:AccessDataSource> </div> </form> </body> </html>

ASPX

Copy Code

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="cs_WebGrid_Default" %>
<%@ Register Assembly="ISNet.WebUI.WebGrid" Namespace="ISNet.WebUI.WebGrid" TagPrefix="ISWebGrid" %>

<!DOCTYPE html>
<html>
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
         <ISWebGrid:WebGrid ID="WebGrid1" runat="server" Height="300px" DataSourceID="AccessDataSource1">
         </ISWebGrid:WebGrid>
         <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/NorthWind.mdb"
             SelectCommand="SELECT TOP 20 * FROM [Orders]"></asp:AccessDataSource>
    </div>
    </form>
</body>
</html>

Note that the xmlns attribute is no longer necessary to be defined in the <html> tag. If you upgraded your existing pages, make sure the xmlns attribute is removed from the <html> tag.

Configure Rendering Mode

To provide the best HTML5 support, WebGrid needs to adjust several features that are commonly processed in the server-side such as markup rendering and AJAX callback response. Unfortunately, the HTML5 doctype cannot be automatically detected by the server-side browser capability. As such, WebGrid introduces a new property called RenderingMode which you must set explicitly in order to activate HTML5 compliance output.

You can set the rendering mode in a WebGrid instance individually by setting the RenderingMode property to HTML5 value, such as shown in the example below.

ASPX	Copy Code
<ISWebGrid:WebGrid ID="WebGrid1" runat="server" RenderingMode="HTML5"> </ISWebGrid:WebGrid>

Alternatively, you can also apply the rendering mode globally through the application-wide configuration, see the following example.

Web.config	Copy Code
<add key="ISNet.WebUI.WebGrid.v8_0_7200.RenderingMode" value="HTML5"/>

If your project is exclusively targeting HTML5, it's recommended to use application-wide configuration to apply the rendering mode to all WebGrid instances in the project.

For more information about application-wide settings in WebGrid, see Application Wide Configurations.

Intersoft WebGrid Documentation
How-to: Enable HTML5 Rendering Mode
See Also Send comments on this topic.

Configure Doc Type

Configure Rendering Mode

See Also