Share via


DataList controle de servidor Web Declarative sintaxe

Exibe os itens de uma fonte de dados usando modelos. Você pode personalizar a aparência e o Sumário do controle manipulando sistema autônomo modelos que compõem sistema autônomo diferentes componentes do DataList controlar sistema autônomo o ItemTemplate e HeaderTemplate.

<asp:DataList
    AccessKey="string"
    BackColor="color name|#dddddd"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    Caption="string"
    CaptionAlign="NotSet|Top|Bottom|Left|Right"
    CellPadding="integer"
    CellSpacing="integer"
    CssClass="string"
    DataKeyField="string"
    DataMember="string"
    DataSource="string"
    DataSourceID="string"
    EditItemIndex="integer"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    ExtractTemplateRows="True|False"
    Font-Bold="True|False"
    Font-Italic="True|False"
    Font-Names="string"
    Font-Overline="True|False"
    Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
        Large|X-Large|XX-Large"
    Font-Strikeout="True|False"
    Font-Underline="True|False"
    ForeColor="color name|#dddddd"
    GridLines="None|Horizontal|Vertical|Both"
    Height="size"
    HorizontalAlign="NotSet|Left|Center|Right|Justify"
    ID="string"
    OnCancelCommand="CancelCommand event handler"
    OnDataBinding="DataBinding event handler"
    OnDeleteCommand="DeleteCommand event handler"
    OnDisposed="Disposed event handler"
    OnEditCommand="EditCommand event handler"
    OnInit="Init event handler"
    OnItemCommand="ItemCommand event handler"
    OnItemCreated="ItemCreated event handler"
    OnItemDataBound="ItemDataBound event handler"
    OnLoad="Load event handler"
    OnPreRender="PreRender event handler"
    OnSelectedIndexChanged="SelectedIndexChanged event handler"
    OnUnload="Unload event handler"
    OnUpdateCommand="UpdateCommand event handler"
    RepeatColumns="integer"
    RepeatDirection="Horizontal|Vertical"
    RepeatLayout="Table|Flow"
    runat="server"
    SelectedIndex="integer"
    ShowFooter="True|False"
    ShowHeader="True|False"
    SkinID="string"
    Style="string"
    TabIndex="integer"
    ToolTip="string"
    UseAccessibleHeader="True|False"
    Visible="True|False"
    Width="size"
>
        <AlternatingItemStyle />
        <AlternatingItemTemplate>
            <!-- child controls -->
        </AlternatingItemTemplate>
        <EditItemStyle />
        <EditItemTemplate>
            <!-- child controls -->
        </EditItemTemplate>
        <FooterStyle />
        <FooterTemplate>
            <!-- child controls -->
        </FooterTemplate>
        <HeaderStyle />
        <HeaderTemplate>
            <!-- child controls -->
        </HeaderTemplate>
        <ItemStyle />
        <ItemTemplate>
            <!-- child controls -->
        </ItemTemplate>
        <SelectedItemStyle />
        <SelectedItemTemplate>
            <!-- child controls -->
        </SelectedItemTemplate>
        <SeparatorStyle />
        <SeparatorTemplate>
            <!-- child controls -->
        </SeparatorTemplate>
</asp:DataList>

Comentários

Você pode manipular o layout e o conteúdo do controle definindo modelos. A tabela a seguir lista os modelos diferentes para o DataList controle.

AlternatingItemTemplate

Semelhante a ItemTemplate elemento, mas processado por Outros linha (linhas alternadas) na DataList controle. Você pode especificar uma aparência diferente para o AlternatingItemTemplate elemento definindo suas propriedades de estilo.

EditItemTemplate

O layout de um item quando ele tiver sido conjunto para o modo de edição. Este modelo geralmente contém controles de edição (sistema autônomo, por exemplo, TextBox controles). The EditItemTemplate é invocado para uma linha a DataList controlar quando o EditItemIndex é definido como o número ordinal da linha.

FooterTemplate

O texto e controles para processar na parte inferior (rodapé) do DataList controle.

The FooterTemplate não pode ser limite a dados.

HeaderTemplate

O texto e controles para processar na parte superior (cabeçalho) do DataList controle.

The HeaderTemplate não pode ser limite a dados.

ItemTemplate

Os elementos para processar uma vez para cada linha na fonte de dados.

SelectedItemTemplate

Os elementos para processar quando o usuário seleciona um item no DataList controle. Usos típicos são para expandir o número de campos de dados exibidos e para marcar a linha com um destaque visualmente.

SeparatorTemplate

Os elementos para processar entre cada item.

The SeparatorTemplate item não pode ser limite a dados.

Você pode personalizar a aparência do DataList controlar especificando um estilo para as diferentes partes do controle. A tabela a seguir lista as propriedades de estilo que controlam a aparência das partes diferentes do DataList controle.

Propriedade de estilo

Descrição

Classe de estilo

AlternatingItemStyle

O estilo de cada Outros item (item alternado).

TableItemStyle

EditItemStyle

O estilo de item que está sendo editado.

TableItemStyle

FooterStyle

O estilo do rodapé no participante da lista (se houver).

TableItemStyle

HeaderStyle

O estilo do cabeçalho no início da lista (se houver).

TableItemStyle

ItemStyle

O estilo de itens individuais.

Style

SelectedItemStyle

O estilo do item selecionado.

TableItemStyle

SeparatorStyle

O estilo para o separador entre cada item.

TableItemStyle

ObservaçãoObservação:

O DataList controle difere do Repeater controle, oferecendo suporte a renderização direcional (através do uso da RepeatColumns e RepeatDirection Propriedades) e a opção processar dentro de uma tabela HTML.

The Items coleção contém os membros com dados vinculados a DataList controle. A coleção é preenchida quando o DataBind método é chamado de DataList controle. Cabeçalho (se houver) é adicionado pela primeira vez, um Item objeto para cada linha de dados. If a SeparatorTemplate existe, Separators são criados e adicionados entre cada item, mas esses não são adicionados para o Items coleção.

Depois de todos os itens foram criados para as linhas no DataSource, o Footer é adicionado ao controle (mas não para o Items coleção). Finalmente, o controle dispara o ItemCreated evento para cada item, incluindo o cabeçalho, rodapé e separadores. Ao contrário da maioria das coleções, a Items coleção não expõe Add ou Remove métodos. No entanto, você pode modificar o Sumário dentro de um item, fornecendo um manipulador para o ItemCreated evento.

Aviso

O texto não é codificado antes que seja exibido em HTML a Controle DataList Isso torna possível incorporar o script nas Rótulos HTML no texto. Se os valores para o controle provenientes da entrada do usuário, certifique-se de validar os valores para ajudar a evitar vulnerabilidades de segurança.

Para obter informações detalhadas sobre o DataList Propriedades e eventos de controle de servidor de Web, consulte o DataList documentação da classe.

Exemplo

O exemplo a seguir demonstra como usar um DataList controle para exibir os itens de uma fonte de dados.

<%@ Page Language="VB" AutoEventWireup="True" %>
<%@ Import Namespace="System.Data" %>

<!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" >
   <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

   </script>

<head runat="server">
    <title>DataList Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>DataList Example</h3>

      <asp:DataList id="ItemsList"
           BorderColor="black"
           CellPadding="5"
           CellSpacing="5"
           RepeatDirection="Vertical"
           RepeatLayout="Table"
           RepeatColumns="3"
           runat="server">

         <HeaderStyle BackColor="#aaaadd">
         </HeaderStyle>

         <AlternatingItemStyle BackColor="Gainsboro">
         </AlternatingItemStyle>

         <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" AlternateText="Product picture" 
                 ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageValue") %>'
                 runat="server"/>

         </ItemTemplate>

      </asp:DataList>

   </form>

</body>
</html>

<%@ Page Language="C#" AutoEventWireup="True" %>
<%@ Import Namespace="System.Data" %>

<!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" >
   <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();
         }

      }

   </script>

<head runat="server">
    <title>DataList Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>DataList Example</h3>

      <asp:DataList id="ItemsList"
           BorderColor="black"
           CellPadding="5"
           CellSpacing="5"
           RepeatDirection="Vertical"
           RepeatLayout="Table"
           RepeatColumns="3"
           runat="server">

         <HeaderStyle BackColor="#aaaadd">
         </HeaderStyle>

         <AlternatingItemStyle BackColor="Gainsboro">
         </AlternatingItemStyle>

         <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" AlternateText="Product picture" 
                 ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageValue") %>'
                 runat="server"/>

         </ItemTemplate>

      </asp:DataList>

   </form>

</body>
</html>

Consulte também

Conceitos

Controles de Servidor do ASP.NET

Referência

DataList

Outros recursos

controle de servidor Web sintaxe