Das DataList Control, bzw. die Templated Controls wurden ja schon einmal von mir behandelt. Nun will ich Ihnen zeigen wie Sie mit dem DataList Control in der Praxis besser arbeiten können. Bekannt ist, dass man für ein Templated Control die jeweiligen "Vorlagen", wie dieses Control die Datenmenge anzeigen soll, in den
HTML Quellcode der ASP.NET Seite implementieren soll. Dies ist jedoch nicht immer erwünscht, denn zum Beispiel wird man in der Praxis versuchen ein Control so gut wie möglich wiederverwendbar zu machen, damit der Code Aufwand so gering wie möglich ausfällt. Aus diesem Grund werden wir das DataList Control als User Control kapseln um es wiederverwendbar zu machen.
Das _Content.ascx User Control:
<%@ Control Language="c#" AutoEventWireup="false" Codebehind="_ContentList.ascx.cs"
Inherits="DevTrain.controls.__ContentList" TargetSchema="http://schemas.microsoft.com/intellisense/ie5"%>
<asp:DataList id="DataList1" runat="server">
<ItemTemplate>
</ItemTemplate>
</asp:DataList>
Die Code Behind Seite zum User Control _Content.ascx:
namespace DevTrain.controls
{
using System;
using System.Collections;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
public abstract class __ContentList : System.Web.UI.UserControl
{
//Proxy for the DataGrid DataSource Property
private IEnumerable dataSource;
public System.Web.UI.WebControls.DataList DataList1;
//The public property which can be set from the outside
public IEnumerable DataSource
{
get
{
return dataSource;
}
set
{
dataSource = value;
}
}
private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
/*DataGrid1.DataSource = dataSource;
DataGrid1.DataBind();*/
DataList1.DataSource = dataSource;
DataList1.DataBind();
}
//.....
}
}
|
In der Code Behind Seite definiere ich eine public Proptery DataSource, welche die Datenquelle für das DataList Control setzt.
Ausserdem setze die den Access Modifier des DataList Controls auf Public um später die ItemTemplate Eigenschaft während der
Laufzeit setzten zu können.
Nachdem wir dieses User Control gebaut und kompiliert haben können wir es in jeder beliebigen ASPX Seite benutzen:
<%@ Page language="c#" Codebehind="WebForm2.aspx.cs" AutoEventWireup="false" Inherits="DevTrain.WebForm2" %>
<%@ Register TagPrefix="ppedv" TagName="Content" runat="Server" src="./controls/_ContentList.ascx" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
<head>
<title>WebForm2</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</head>
<body MS_POSITIONING="GridLayout">
<form id="WebForm2" method="post" runat="server">
<ppedv:Content id="content1" runat="Server"></ppedv:Content>
</form>
</body>
</html> |
Wir Registrieren das User Control wie üblich über die Register Direktive und verwenden das Control.
Wie Sie hoffentlich bemerkt haben, habe ich im User Control _ContentList.ascx, das DataList Control nur mit einer leeren <ItemTemplate> Eigenschaft gefüllt. In der ASPX Seite die das Control verwendet werden wir nun die ItemTemplate Eigenschaft zur Laufzeit setzen.
Dafür muss man eine Template Datei anlegen, welche die Formatierung für die jeweiligen Templates innehat.
Die Vorlage für das <ItemTemplate></ItemTemplate> Element des DataList Controls:
<%@ Control Language="VB" AutoEventWireup="false" TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>
<table width="99%" align="right" cellspacing="0" cellpadding="0">
<tr height=55><th><h1>Artikel & News<hr></h1></th></tr>
<tr><th><h4><%# DataBinder.Eval(CType(Container, DataListItem).DataItem, "THEMA") %><br><br></th></tr>
</table> |
Diese Vorlagen Datei können wir dann zur Laufzeit an das Control binden, dies machen wir aus der ASPX Seite heraus:
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
using ppedv.Components;
namespace DevTrain
{
public class news : System.Web.UI.Page
{
protected DevTrain.controls.__ContentList Content1;
protected DatabaseSQL myDB = new DatabaseSQL();
protected SqlDataReader drReader;
private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
myDB.RunSqlStatement("SELECT * FROM IINHALTE WHERE ENTRY_ID = " +
Request.QueryString["artnr"], out drReader);
Content1.DataSource = drReader;
Content1.DataBind();
Content1.DataList1.ItemTemplate = Page.LoadTemplate("./controls/_Article_Template.ascx");
}
//....
}
}
|
Sie sehen, dass ich in der Code Behind Seite der WebForm einen DataReader benutze um die Daten zu visualisieren. Wichtig ist eigentlich nur die letzte Zeile:
Content1.DataList1.ItemTemplate = Page.LoadTemplate("./controls/_Article_Template.ascx");
Ich setze hier nun also die ItemTemplate Eigenschaft der DataList aus dem User Control (hier mit der ID Content1) auf das Template das ich zuvor erzeugt habe. Damit kann man sehr einfach Templates während der Laufzeit an ein DataList Control binden.
Viel Spass beim Ausprobieren!