ASP.NET Dynamic Data - Part 5 - Customize Page Templates

• ASP.NET Dynamic Data - Part 1 - Introduction
• ASP.NET Dynamic Data - Part 2 - Create a Web Site From Scratch
• ASP.NET Dynamic Data - Part 3 - Customize Field Templates
• ASP.NET Dynamic Data - Part 4 - Customize Entity Templates
• ASP.NET Dynamic Data - Part 5 - Customize Page Templates
• ASP.NET Dynamic Data - Part 6 - Customize Field Templates For Non-Intrinsic Types
• ASP.NET Dynamic Data - Part 7 - Customize Edit Field Templates

Another way to customize a table's layout is custom page templates, the other way, entity templates are described in part 3.

How to create a custom page template

1. Create the subfolder named according to the table accessor in the data-context class.
2. Copy an existing page template from /DynamicData/PageTemplates to the newly created subfolder.
3. If you're project is a Web Application, the namespace must be changed in the copied template, in order to avoid name collision.

Now just customize the copied template, as needed.
Again building on the previous project in the series, my example for the page template for the Categories table looks like this.
Details.aspx:

<%@ Page Language="C#" MasterPageFile="~/Site.master" CodeFile="Details.aspx.cs" Inherits="Details" %>

<asp:Content ID="headContent" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <asp:DynamicDataManager ID="DynamicDataManager1" runat="server" AutoLoadForeignKeys="true">
        <DataControls>
            <asp:DataControlReference ControlID="FormView1" />
        </DataControls>
    </asp:DynamicDataManager>

    <h2 class="DDSubHeader">Details for <%= table.DisplayName %> entry</h2>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:ValidationSummary ID="ValidationSummary1" runat="server" EnableClientScript="true"
                HeaderText="List of validation errors" CssClass="DDValidator" />
            <asp:DynamicValidator runat="server" ID="DetailsViewValidator" ControlToValidate="FormView1" Display="None" CssClass="DDValidator" />

            <asp:FormView runat="server" ID="FormView1" DataSourceID="DetailsDataSource" OnItemDeleted="FormView1_ItemDeleted" RenderOuterTable="false">
                <ItemTemplate>
                    <table id="detailsTable" class="DDDetailsTable" cellpadding="6">
                        <asp:DynamicEntity runat="server" />
                        <tr class="td">
                            <td colspan="2">
                                <asp:DynamicHyperLink runat="server" Action="Edit" Text="Edit" />
                                <asp:LinkButton runat="server" CommandName="Delete" Text="Delete"
                                    OnClientClick='return confirm("Are you sure you want to delete this item?");' />
                            </td>
                        </tr>
                    </table>
                </ItemTemplate>
                <EmptyDataTemplate>
                    <div class="DDNoItem">No such item.</div>
                </EmptyDataTemplate>
            </asp:FormView>

            <asp:EntityDataSource ID="DetailsDataSource" runat="server" EnableDelete="true" />

            <asp:QueryExtender TargetControlID="DetailsDataSource" ID="DetailsQueryExtender" runat="server">
                <asp:DynamicRouteExpression />
            </asp:QueryExtender>

            <br />

            <div class="DDBottomHyperLink">
                <asp:DynamicHyperLink ID="ListHyperLink" runat="server" Action="List">Show all items</asp:DynamicHyperLink>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
</asp:Content>

Details.aspx.cs:

using System;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Web.DynamicData;
using System.Web.Routing;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.Expressions;

public partial class Details : System.Web.UI.Page {
    protected MetaTable table;

    protected void Page_Init(object sender, EventArgs e) {
        table = DynamicDataRouteHandler.GetRequestMetaTable(Context);
        FormView1.SetMetaTable(table);
        DetailsDataSource.EntityTypeFilter = table.EntityType.Name;
    }

    protected void Page_Load(object sender, EventArgs e) {
        Title = table.DisplayName;
        DetailsDataSource.Include = table.ForeignKeyColumnsNames;
    }

    protected void FormView1_ItemDeleted(object sender, FormViewDeletedEventArgs e) {
        if (e.Exception == null || e.ExceptionHandled) {
            Response.Redirect(table.ListActionPath);
        }
    }
}

I've just changed the page headline from Entry from table Categories to Details for Categories entry. I haven't made any changes to the default Details code-behind or markup other than the change described above.
The details page for the Categories table now looks like this:

Entity Template vs. Page Template

The page template allows control over the page layout and contents, the entity template only allows control on the table contents itself. Whether to use entity templates or page templates depends on the use case. Both templates are very easy to create and modify. Also page templates required zero code, except on the template itself, if more advanced functionality are required.