Completing a Simple Storefront with LINQ - Markup
(Page 2 of 4 )
Here's how the markup for this works:
<%@ Page Language="C#" MasterPageFile="~/MasterPage.master"
AutoEventWireup="true"
CodeFile="Product.aspx.cs" Inherits="Product" Title="View Product" %>
<asp:Content ID="Content1" ContentPlaceHolderID="content"
Runat="Server">
<asp:MultiView ID="ProductMultiView" runat="server">
<asp:View ID="InvalidProductView" runat="server">
Invalid product! Please go back and try again.
</asp:View>
<asp:View ID="ValidProductView" runat="server">
<div class="itemBoxLarge">
<asp:Image ID="ProductImage" CssClass="productImage"
runat="server" />
<strong><asp:Label ID="NameLabel" runat="server" /></strong>
<br />
Category: <asp:Label ID="CategoryLabel" runat="server" /><br />
List Price: <asp:Label ID="PriceLabel" runat="server" /><br />
Color: <asp:Label ID="ColorLabel" runat="server" /><br />
<p><asp:Label ID="DescriptionLabel" runat="server" /></p>
</div>
</asp:View>
</asp:MultiView>
</asp:Content>
As you can see above, we've used an Image control to display the product's image, and we've used Label controls to display textual information about the product. We display the name of the product, the category that the product is under, the list price of the product, the color of the product, and a description of the product. However, feel free to add more fields.
Now we need to write the code to populate the page with data. First, we need to check whether the ProductID is set in the query string. If it's not, we need to set the active View to InvalidProductView and stop. If it is, we need to query the database. Then, we need to check to see if the query returns anything. If it doesn't return anything, then the ProductID is invalid. If it does return something, then we need to set the active View to ValidProductView and then set the Image control's ImageUrl property and the Label controls' Text properties.
Here's how it's all done. Place the following code in the Page_Load method:
ProductMultiView.SetActiveView(InvalidProductView);
if (Request.QueryString["id"] != null)
{
AdventureWorksDataContext db = new AdventureWorksDataContext();
var product = (from p in db.Products
where p.ProductID == int.Parse(Request.QueryString["id"])
select new
{
ProductID = p.ProductID,
Name = p.Name,
Category = p.ProductCategory.Name,
ListPrice = p.ListPrice,
Color = p.Color,
Description =
p.ProductModel.ProductModelProductDescription.ProductDescription.
Description
}).FirstOrDefault();
if (product != null)
{
ProductMultiView.SetActiveView(ValidProductView);
Page.Title = "View Product: " + product.Name;
ProductImage.ImageUrl = "ProductPicture.aspx?id=" + product.ProductID.ToString();
NameLabel.Text = product.Name;
CategoryLabel.Text = product.Category;
PriceLabel.Text = String.Format("{0:C}", product.ListPrice);
ColorLabel.Text = product.Color;
DescriptionLabel.Text = product.Description;
}
}
Notice how we set ProductMultiView's active View to InvalidProductView to start. Then, if and only if the ProductID is valid, we switch to ValidProductView. Also notice how we change the title of the page to include the product's name, and how we create an anonymous type to store product information.
The Product.aspx page is now complete. Running it with no query string should generate an error, but clicking on an entry in the list of latest products in Default.aspx should return information about that product.
Next: Building the Product Browse Page >>
More .NET Articles
More By Peyton McCullough