Library tutorials & articles

Creating a Master-detail page

Getting Started

Now that we have a sense of what we need let's start creating the .aspx page.

Ok, we'll just start of by adding a Page directive, where we define the language we are going to use for this page and what codebehind we want to use. Also take note of the Import directive as we need this throughout the page:

<%@ Page Language="C#" Codebehind="MasterDetail.aspx.cs" Inherits="MasterDetail.MasterDetail" %>
<%@ Import Namespace="System.Data" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
<head>
<title>Master-Detail</title>
<style type="text/css">
h1    { font-family: verdana; font-weight: bold; font-size: 16px; color: red; padding-bottom: 5px; margin-bottom: 0px; }
td    { font-family: verdana; font-size: 12px; }
</style>
</head>
<body>

I've also added a couple of styles to the page, but this is optional. Now that the base is in place we need to add the first Repeater control, and define the ItemTemplate:

<asp:repeater id="Categories" runat="server">
    <itemtemplate>
        <h1><%# ((DataRowView) Container.DataItem)["CategoryName"] %></h1>

The preceding code very simple stuff, the only thing that may be new to you is the way I databind the 'CategoryName' field; Instead of using the 'standard' way, namely by using DataBinder.Eval(), I simply cast Container.DataItem to a DataRowView (this is why we needed that Import directive) and then refer to the field I want to print to the screen.

Next we need to add the second the Repeater control, the one that will display all products within the respective categories:

<asp:repeater id="Products" runat="server">
    <headertemplate>
        <table cellpadding="2" cellspacing="1" bgcolor="#666666" width="490">
            <tr bgcolor="#ffffff">
                <td width="300"><b>ProductName</b></td>
                <td width="150"><b>QuantityPerUnit</b></td>
                <td width="20"><b>UnitPrice</b></td>
                <td width="20"><b>UnitsInStock</b></td>
            </tr>
    </headertemplate>
    <itemtemplate>
        <tr bgcolor="#ffffff">
            <td width="300"><%# ((DataRowView) Container.DataItem)["ProductName"] %></td>
            <td width="150"><%# ((DataRowView) Container.DataItem)["QuantityPerUnit"] %></td>
            <td width="20"><%# DataBinder.Eval(Container.DataItem, "UnitPrice", "{0:c}") %></td>
            <td width="20"><%# ((DataRowView) Container.DataItem)["UnitsInStock"] %></td>
        </tr>
    </itemtemplate>
    <footertemplate>
        </table>
    </footertemplate>
</asp:repeater>

Once again, simple stuff, although there is one thing you might want to take note of; when I databind the 'UnitPrice' column I use the 'standard' approach as it allows for quick and simple string formatting. By adding "{0:c}" the output is formatted as currency.

Finally we'll just clean up before continuing on to the codebehind file:

    </itemtemplate>
    <separatortemplate>
        <br/><br/>
    </separatortemplate>
</asp:repeater>
</body>
</html>

Comments

  1. 01 Sep 2008 at 08:06

    hi,

    i am trying to transfer Invoice type,Invoice no and Invoice Date as per given below code But unable to access the value on the second page pls help me how it is possible

    ' runat="server" > ' runat="server" > ' runat="server" >--%> Example

    ' runat="server">--%> ">' runat="server">--%> ' runat="server" > ' runat="server" > ' runat="server" > ' runat="server" > ' runat="server" > ' runat="server" > ' runat="server" > ' runat="server" > ' runat="server" >

  2. 22 Apr 2004 at 23:33

    I am trying to test your code, so i found this below error:


    First all:I only put the Code into a web application folder,not user the vs.net to do,but when i try to browse the page,the application error tell me on't load the Masterdetail.masterdeatil,error line's Code is:inherits=Masterdetail.masterdetail.


    Second:I created a solution in vs.net,above the error is losed,but the .aspx page not display the result,why?


    My sql server connection string is right!

  3. 01 Jan 1999 at 00:00

    This thread is for discussions of Creating a Master-detail page.

Leave a comment

Sign in or Join us (it's free).

AddThis

Related podcasts

  • CodeCast Episode 4: State of .NET, IE8, ASP.NET MVC, and O'Reilly Media

    CodeCast Episode 4: State of .NET, IE8, ASP.NET MVC, and O'Reilly MediaHosts Ken Levy and Markus Egger discuss the new State of .NET events, IE8, ASP.NET MVC, followed by an interview from PDC with two editors from O'Reilly Media. More on ASP.NET MVC can be found at http://asp.net/mvc. Interview...

Related jobs

Events coming up