ListView.GroupTemplate 속성
정의
중요
일부 정보는 릴리스되기 전에 상당 부분 수정될 수 있는 시험판 제품과 관련이 있습니다. Microsoft는 여기에 제공된 정보에 대해 어떠한 명시적이거나 묵시적인 보증도 하지 않습니다.
ListView 컨트롤의 그룹 컨테이너에 대한 사용자 정의 내용을 가져오거나 설정합니다.
public:
virtual property System::Web::UI::ITemplate ^ GroupTemplate { System::Web::UI::ITemplate ^ get(); void set(System::Web::UI::ITemplate ^ value); };
[System.ComponentModel.Browsable(false)]
[System.Web.UI.PersistenceMode(System.Web.UI.PersistenceMode.InnerProperty)]
[System.Web.UI.TemplateContainer(typeof(System.Web.UI.WebControls.ListViewItem))]
public virtual System.Web.UI.ITemplate GroupTemplate { get; set; }
[<System.ComponentModel.Browsable(false)>]
[<System.Web.UI.PersistenceMode(System.Web.UI.PersistenceMode.InnerProperty)>]
[<System.Web.UI.TemplateContainer(typeof(System.Web.UI.WebControls.ListViewItem))>]
member this.GroupTemplate : System.Web.UI.ITemplate with get, set
Public Overridable Property GroupTemplate As ITemplate
속성 값
ListView 컨트롤의 그룹 컨테이너에 대한 사용자 지정 내용이 들어 있는 개체입니다. 기본값은 null
로, 이 속성이 설정되어 있지 않음을 나타냅니다.
- 특성
예제
다음 예제에서는 속성을 사용 하 여 컨트롤에서 바일형 레이아웃을 ListView 만드는 방법을 보여 있습니다 GroupTemplate .
<%@ Page language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>ListView Tiled Layout Example</title>
<style type="text/css">
.header
{
background-color:#B0C4DE;
border-top:solid 1px #9dbbcc;
border-bottom:solid 1px #9dbbcc;
}
.separator { border-right: 1px solid #ccc; }
</style>
</head>
<body>
<form id="form1" runat="server">
<h3>ListView Tiled Layout Example</h3>
<asp:ListView ID="ProductsListView"
DataSourceID="ProductsDataSource"
GroupItemCount="2"
runat="server">
<LayoutTemplate>
<table cellpadding="2" width="640px" runat="server" id="tblProducts">
<tr runat="server" class="header">
<th runat="server" colspan="3">PRODUCTS LIST</th>
</tr>
<tr runat="server" id="groupPlaceholder" />
</table>
</LayoutTemplate>
<GroupTemplate>
<tr runat="server" id="ProductsRow">
<td runat="server" id="itemPlaceholder" />
</tr>
</GroupTemplate>
<GroupSeparatorTemplate>
<tr runat="server">
<td colspan="3"><hr /></td>
</tr>
</GroupSeparatorTemplate>
<ItemTemplate>
<td align="center" style="width:300px" runat="server">
<asp:HyperLink ID="ProductLink" runat="server"
Text='<%# Eval("Name") %>'
NavigateUrl='<%# "ProductDetails.aspx?productID=" + Eval("ProductID") %>' /><br />
<asp:Image ID="ProductImage" runat="server"
ImageUrl='<%# "~/images/thumbnails/" + Eval("ThumbnailPhotoFileName") %>' /><br />
<b>Price:</b>
<asp:Label ID="PriceLabel" runat="server" Text='<%# Eval("ListPrice", "{0:c}")%>' /><br />
</td>
</ItemTemplate>
<ItemSeparatorTemplate>
<td class="separator" runat="server"> </td>
</ItemSeparatorTemplate>
</asp:ListView>
<br />
<asp:DataPager runat="server" ID="ProductsDataPager"
PagedControlID="ProductsListView">
<Fields>
<asp:NextPreviousPagerField ButtonType="Button"
ShowFirstPageButton="true"
ShowNextPageButton="false"
ShowPreviousPageButton="false" />
<asp:NumericPagerField ButtonCount="10" />
<asp:NextPreviousPagerField ButtonType="Button"
ShowLastPageButton="true"
ShowNextPageButton="false"
ShowPreviousPageButton="false" />
</Fields>
</asp:DataPager>
<!-- This example uses Microsoft SQL Server and connects -->
<!-- to the AdventureWorks sample database. Use an ASP.NET -->
<!-- expression to retrieve the connection string value -->
<!-- from the Web.config file. -->
<asp:SqlDataSource ID="ProductsDataSource" runat="server"
ConnectionString="<%$ ConnectionStrings:AdventureWorks_DataConnectionString %>"
SelectCommand="SELECT P.ProductID, P.Name, P.Color, P.ListPrice,
PF.ThumbnailPhotoFileName
FROM Production.Product AS P
INNER JOIN Production.ProductProductPhoto AS PPF ON P.ProductID = PPF.ProductID
INNER JOIN Production.ProductPhoto AS PF ON PPF.ProductPhotoID = PF.ProductPhotoID">
</asp:SqlDataSource>
</form>
</body>
</html>
<%@ Page language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>ListView Tiled Layout Example</title>
<style type="text/css">
.header
{
background-color:#B0C4DE;
border-top:solid 1px #9dbbcc;
border-bottom:solid 1px #9dbbcc;
}
.separator { border-right: 1px solid #ccc; }
</style>
</head>
<body>
<form id="form1" runat="server">
<h3>ListView Tiled Layout Example</h3>
<asp:ListView ID="ProductsListView"
DataSourceID="ProductsDataSource"
GroupItemCount="2"
runat="server">
<LayoutTemplate>
<table cellpadding="2" width="640px" runat="server" id="tblProducts">
<tr runat="server" class="header">
<th runat="server" colspan="3">PRODUCTS LIST</th>
</tr>
<tr runat="server" id="groupPlaceholder" />
</table>
</LayoutTemplate>
<GroupTemplate>
<tr runat="server" id="ProductsRow">
<td runat="server" id="itemPlaceholder" />
</tr>
</GroupTemplate>
<GroupSeparatorTemplate>
<tr runat="server">
<td colspan="3"><hr /></td>
</tr>
</GroupSeparatorTemplate>
<ItemTemplate>
<td align="center" style="width:300px" runat="server">
<asp:HyperLink ID="ProductLink" runat="server"
Text='<%# Eval("Name") %>'
NavigateUrl='<%# "ProductDetails.aspx?productID=" & Eval("ProductID") %>' /><br />
<asp:Image ID="ProductImage" runat="server"
ImageUrl='<%# "~/images/thumbnails/" & Eval("ThumbnailPhotoFileName") %>' /><br />
<b>Price:</b>
<asp:Label ID="PriceLabel" runat="server" Text='<%# Eval("ListPrice", "{0:c}")%>' /><br />
</td>
</ItemTemplate>
<ItemSeparatorTemplate>
<td class="separator" runat="server"> </td>
</ItemSeparatorTemplate>
</asp:ListView>
<br />
<asp:DataPager runat="server" ID="ProductsDataPager"
PagedControlID="ProductsListView">
<Fields>
<asp:NextPreviousPagerField ButtonType="Button"
ShowFirstPageButton="true"
ShowNextPageButton="false"
ShowPreviousPageButton="false" />
<asp:NumericPagerField ButtonCount="10" />
<asp:NextPreviousPagerField ButtonType="Button"
ShowLastPageButton="true"
ShowNextPageButton="false"
ShowPreviousPageButton="false" />
</Fields>
</asp:DataPager>
<!-- This example uses Microsoft SQL Server and connects -->
<!-- to the AdventureWorks sample database. Use an ASP.NET -->
<!-- expression to retrieve the connection string value -->
<!-- from the Web.config file. -->
<asp:SqlDataSource ID="ProductsDataSource" runat="server"
ConnectionString="<%$ ConnectionStrings:AdventureWorks_DataConnectionString %>"
SelectCommand="SELECT P.ProductID, P.Name, P.Color, P.ListPrice,
PF.ThumbnailPhotoFileName
FROM Production.Product AS P
INNER JOIN Production.ProductProductPhoto AS PPF ON P.ProductID = PPF.ProductID
INNER JOIN Production.ProductPhoto AS PF ON PPF.ProductPhotoID = PF.ProductPhotoID">
</asp:SqlDataSource>
</form>
</body>
</html>
설명
컨트롤에서 GroupTemplate 타일형 레이아웃 ListView 을 만들려면 이 속성을 사용합니다. 타일식 표 레이아웃에서는 항목이 행에서 가로로 반복됩니다. 항목이 반복되는 횟수는 속성에 GroupItemCount 의해 지정됩니다.
그룹 컨테이너에 대해 선언적으로 템플릿을 지정하려면 컨트롤 내부에 ListView 요소를 추가 GroupTemplate
합니다. 그런 다음, 템플릿의 내용을 요소에 GroupTemplate
추가할 수 있습니다.
속성에는 GroupTemplate 테이블 셀(td
) div
또는 span
요소와 같은 데이터 항목에 대한 자리 표시자가 포함되어야 합니다. 이 자리 표시자는 특성이 runat
"server"로 설정되고 특성이 ID
속성 값 ItemPlaceholderID 으로 설정되어 있어야 합니다. 런타임에 컨트롤은 ListView 자리 표시자를 템플릿의 각 항목에 대해 정의된 콘텐츠로 ItemTemplate AlternatingItemTemplate 바꿉니다.