DataList.SeparatorStyle プロパティ
DataList コントロールの各項目間の区切り記号のスタイル プロパティを取得します。
Public Overridable ReadOnly Property SeparatorStyle As _
TableItemStyle
[C#]
public virtual TableItemStyle SeparatorStyle {get;}
[C++]
public: __property virtual TableItemStyle* get_SeparatorStyle();
[JScript]
public function get SeparatorStyle() : TableItemStyle;
プロパティ値
DataList コントロールの各項目間の区切り記号のスタイル プロパティを格納している TableItemStyle オブジェクト。既定値は空の TableItemStyle オブジェクトです。
解説
SeparatorStyle プロパティを使用して、 DataList コントロールの各項目間の区切り記号のカスタム スタイルを指定します。区切り記号を使用すると、 DataList コントロールの各項目間にカスタム内容の要素を配置できます。調整できる共通スタイル属性には、前景色、背景色、フォント、セル内の内容の配置などがあります。異なるスタイルを指定すると、 DataList コントロールの外観が詳細に設定されます。
区切り記号のカスタム スタイルを指定するには、 <SeparatorStyle> タグを DataList コントロールの開始タグと終了タグの間に配置します。その後、 <SeparatorStyle> の開始タグ内にスタイル属性のリストを記述できます。
使用例
[Visual Basic, C#] SeparatorStyle プロパティを使用して、 DataList コントロールの各項目間の区切り記号にカスタム背景色を指定する方法の例を次に示します。
[Visual Basic, C#] メモ 次のコード サンプルはシングルファイル コード モデルを使用しており、分離コード ファイルに直接コピーされた場合は正常に動作しない可能性があります。このコード サンプルは、拡張子が .aspx の空のテキスト ファイルにコピーする必要があります。Web フォームのコード モデルの詳細については、「 Web フォームのコード モデル 」を参照してください。
<%@ Page Language="VB" AutoEventWireup="True" %>
<%@ Import Namespace="System.Data" %>
<html>
<script runat="server">
Function CreateDataSource() As ICollection
' Create sample data for the DataList control.
Dim dt As DataTable = New DataTable()
dim dr As DataRow
' Define the columns of the table.
dt.Columns.Add(New DataColumn("IntegerValue", GetType(Int32)))
dt.Columns.Add(New DataColumn("StringValue", GetType(String)))
dt.Columns.Add(New DataColumn("CurrencyValue", GetType(Double)))
dt.Columns.Add(New DataColumn("ImageValue", GetType(String)))
' Populate the table with sample values.
Dim i As Integer
For i = 0 To 8
dr = dt.NewRow()
dr(0) = i
dr(1) = "Description for item " & i.ToString()
dr(2) = 1.23 * (i + 1)
dr(3) = "Image" & i.ToString() & ".jpg"
dt.Rows.Add(dr)
Next i
Dim dv As DataView = New DataView(dt)
Return dv
End Function
Sub Page_Load(sender As Object, e As EventArgs)
' Load sample data only once when, the page is first loaded.
If Not IsPostBack Then
ItemsList.DataSource = CreateDataSource()
ItemsList.DataBind()
End If
End Sub
Sub Selection_Change(sender As Object, e As EventArgs)
' Set the background color for the separator section of
' the DataList control.
ItemsList.SeparatorStyle.BackColor = _
System.Drawing.Color.FromName(ItemList.SelectedItem.Value)
End Sub
</script>
<body>
<form runat=server>
<h3>DataList SeparatorTemplate and SeparatorStyle Example</h3>
Select a background color for the separator between
items in the DataList.
<br><br>
<asp:DataList id="ItemsList"
BorderColor="black"
CellPadding="5"
CellSpacing="5"
RepeatDirection="Vertical"
RepeatLayout="Table"
RepeatColumns="3"
ShowBorder="True"
ShowFooter="True"
runat="server">
<HeaderStyle BackColor="#aaaadd">
</HeaderStyle>
<ItemStyle BackColor="Silver">
</ItemStyle>
<AlternatingItemStyle BackColor="DarkGray">
</AlternatingItemStyle>
<SeparatorStyle BackColor="White">
</SeparatorStyle>
<HeaderTemplate>
List of items
</HeaderTemplate>
<ItemTemplate>
Description: <br>
<%# DataBinder.Eval(Container.DataItem, "StringValue") %>
<br>
Price: <%# DataBinder.Eval(Container.DataItem, "CurrencyValue", "{0:c}") %>
<br>
<asp:Image id="ProductImage"
ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageValue") %>'
runat="server"/>
</ItemTemplate>
<SeparatorTemplate>
<asp:Image id="SeparatorImage"
ImageUrl="SeparatorImage.jpg"
runat="server"/>
</SeparatorTemplate>
</asp:DataList>
<hr>
<table cellpadding="5">
<tr>
<td>
Separator BackColor:
</td>
</tr>
<tr>
<td>
<asp:DropDownList id="ItemList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem Selected="True" Value="White"> White </asp:ListItem>
<asp:ListItem Value="Silver"> Silver </asp:ListItem>
<asp:ListItem Value="DarkGray"> Dark Gray </asp:ListItem>
<asp:ListItem Value="Khaki"> Khaki </asp:ListItem>
<asp:ListItem Value="DarkKhaki"> Dark Khaki </asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</form>
</body>
</html>
[C#]
<%@ Page Language="C#" AutoEventWireup="True" %>
<%@ Import Namespace="System.Data" %>
<html>
<script runat="server">
ICollection CreateDataSource()
{
// Create sample data for the DataList control.
DataTable dt = new DataTable();
DataRow dr;
// Define the columns of the table.
dt.Columns.Add(new DataColumn("IntegerValue", typeof(Int32)));
dt.Columns.Add(new DataColumn("StringValue", typeof(String)));
dt.Columns.Add(new DataColumn("CurrencyValue", typeof(double)));
dt.Columns.Add(new DataColumn("ImageValue", typeof(String)));
// Populate the table with sample values.
for (int i = 0; i < 9; i++)
{
dr = dt.NewRow();
dr[0] = i;
dr[1] = "Description for item " + i.ToString();
dr[2] = 1.23 * (i + 1);
dr[3] = "Image" + i.ToString() + ".jpg";
dt.Rows.Add(dr);
}
DataView dv = new DataView(dt);
return dv;
}
void Page_Load(Object sender, EventArgs e)
{
// Load sample data only once, when the page is first loaded.
if (!IsPostBack)
{
ItemsList.DataSource = CreateDataSource();
ItemsList.DataBind();
}
}
void Selection_Change(Object sender, EventArgs e)
{
// Set the background color for the separator section of
// the DataList control.
ItemsList.SeparatorStyle.BackColor =
System.Drawing.Color.FromName(ItemList.SelectedItem.Value);
}
</script>
<body>
<form runat=server>
<h3>DataList SeparatorTemplate and SeparatorStyle Example</h3>
Select a background color for the separator between
items in the DataList.
<br><br>
<asp:DataList id="ItemsList"
BorderColor="black"
CellPadding="5"
CellSpacing="5"
RepeatDirection="Vertical"
RepeatLayout="Table"
RepeatColumns="3"
ShowBorder="True"
ShowFooter="True"
runat="server">
<HeaderStyle BackColor="#aaaadd">
</HeaderStyle>
<ItemStyle BackColor="Silver">
</ItemStyle>
<AlternatingItemStyle BackColor="DarkGray">
</AlternatingItemStyle>
<SeparatorStyle BackColor="White">
</SeparatorStyle>
<HeaderTemplate>
List of items
</HeaderTemplate>
<ItemTemplate>
Description: <br>
<%# DataBinder.Eval(Container.DataItem, "StringValue") %>
<br>
Price: <%# DataBinder.Eval(Container.DataItem, "CurrencyValue", "{0:c}") %>
<br>
<asp:Image id="ProductImage"
ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageValue") %>'
runat="server"/>
</ItemTemplate>
<SeparatorTemplate>
<asp:Image id="SeparatorImage"
ImageUrl="SeparatorImage.jpg"
runat="server"/>
</SeparatorTemplate>
</asp:DataList>
<hr>
<table cellpadding="5">
<tr>
<td>
Separator BackColor:
</td>
</tr>
<tr>
<td>
<asp:DropDownList id="ItemList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem Selected="True" Value="White"> White </asp:ListItem>
<asp:ListItem Value="Silver"> Silver </asp:ListItem>
<asp:ListItem Value="DarkGray"> Dark Gray </asp:ListItem>
<asp:ListItem Value="Khaki"> Khaki </asp:ListItem>
<asp:ListItem Value="DarkKhaki"> Dark Khaki </asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</form>
</body>
</html>
[C++, JScript] C++ および JScript のサンプルはありません。Visual Basic および C# のサンプルを表示するには、このページの左上隅にある言語のフィルタ ボタン .gif)
をクリックします。
必要条件
プラットフォーム: Windows 2000, Windows XP Professional, Windows Server 2003 ファミリ
参照
DataList クラス | DataList メンバ | System.Web.UI.WebControls 名前空間 | SeparatorTemplate | TableItemStyle | Style