8.2.4.1. Переопределение Page_load
Прежде всего, определим структуру данных, которая будет использоваться для отображения. Назовем новый класс CycleHelper, и пусть он содержит два публичных свойства: StockCount и Name:
public class CycleHelper
{
public int StockCount
{
get; set;
}
public string Name
{
get; set;
}
}
Определим на самой странице типизированный список CycleHelper, который буем отображать, а в методе Page_Load заполним этот список значениями (позднее мы будем брать данные и базы данных) и привяжем методом DataBind() наш список к таблице:
List<CycleHelper> chs = new List<CycleHelper>();
protected void Page_Load(object sender, EventArgs e)
{
chs.Add(new CycleHelper() {Name = "Mountain Tire Tube",StockCount = 191});
chs.Add(new CycleHelper() {Name = "Patch Kit/8 Patches",StockCount = 184});
chs.Add(new CycleHelper() {Name = "Water Bottle — 30 oz.",StockCount = 175});
chs.Add(new CycleHelper() {Name = "Road Tire Tube",StockCount = 161});
chs.Add(new CycleHelper() {Name = "Fender Set — Mountain",StockCount = 110});
GridViewProducts.DataSource = chs;
GridViewProducts.DataBind();
}
Также добавим обработчик события OnSelectedIndexChanged компонента GridView:
protected void OnSelectedIndexChanged(object sender, EventArgs e)
{
var cycle = chs[GridViewProducts.SelectedIndex];
ProductDetails.LoadContent(cycle.Name, cycle.StockCount);
}
Чтобы этот код заработал, нам необходимо разработать собственный компонент ProductDetails.
8.2.5. Разработка пользовательских компонент
Для разработки и повторного использования собственных компонент используются файлы с расширением ascx.
Добавим в папку products файл ProductDetails.ascx через пункт контекстного меню Add New Item (рис. 8.15).
Рис. 8.15. Добавление в проект нового пользовательского серверного компонента
Как и в случае со страницей будет создано два файла, один из которых содержит разметку компонента, а второй – серверный код.
Код с разметкой начинается с заголовка, указывающего, что в этом файле описывается серверный компонент на языке C#, бэк-код которого содержится в файле ProductControl.ascx.cs, а сам компонент будет иметь название products_ProductControl:
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ProductControl.ascx.cs" Inherits="products_ProductControl" %>
Остальная часть файла представляет собой обычную таблицу на HTML, которая содержит несколько компонент Label и один компонент Image. Все серверные пользовательские компоненты наследуют от класса System.Web.UI.UserControl, хотя также есть возможность отнаследовать свой компонент и от некоторых других классов.
В самом компоненте определим метод Page_Load, в котором для компонента Image укажем путь к картинке (таким образом, если бы у нас была бы картинка для каждого товара, мы могли бы указать путь к этой картинке), а также установим свойство Visible значение false. Это приведет к тому, что компонент не будет отрисовываться на странице.
Также определим метод LoadContent, который будет означивать надписи компонента переданными значениями и устанавливать свойство Visble в True;
protected void Page_Load(object sender, EventArgs e)
{
Visible = false;
Image1.ImageUrl = "~/images/Black_racer02_F_large.gif";
}
public void LoadContent(string name, int count)
{
Visible = true;
LabelName.Text = name;
LabelCount.Text = count.ToString();
}
На рис. 8.16 показано, как разработанный компонент выглядит в дизайнере Visual Studio 2008.
Рис. 8.16. Отображение компонента ProductControl в дизайнере Visual Studio 2008