Condividi tramite

Cenni preliminari sul controllo server Web ListView

  • Articolo

Aggiornamento: novembre 2007

Il controllo ListView ASP.NET consente di eseguire l'associazione agli elementi di dati restituiti da un'origine dati e di visualizzarli. È possibile visualizzare i dati nelle pagine. È possibile visualizzare gli elementi individualmente o raggrupparli.

Il controllo ListView visualizza i dati nel formato definito mediante modelli e stili. Semplifica la gestione dei dati inclusi in una struttura ripetuta, simile ai controlli DataList e Repeater. Tuttavia, a differenza di tali controlli, con il controllo ListView è possibile consentire agli utenti di modificare, inserire ed eliminare dati e ordinare e impaginare i dati delle pagine, senza codice.

Vengono illustrati i seguenti argomenti:

  • Associazione di dati al controllo ListView

  • Creazione di modelli per il controllo ListView

  • Spostamento tra i dati

  • Ordinamento dei dati

  • Modifica dei dati

  • Applicazione di stili agli elementi ListView

  • Riferimento alle classi

  • Esempi di codice

  • Risorse supplementari

Associazione di dati al controllo ListView

È possibile associare il controllo ListView ai dati nei modi seguenti:

  • Utilizzando la proprietà DataSourceID, che consente di associare il controllo ListView a un controllo origine dati, ad esempio il controllo SqlDataSource. Si consiglia questo approccio perché consente al controllo ListView di sfruttare le funzionalità del controllo origine dati. Fornisce inoltre la funzionalità incorporata per l'ordinamento, lo spostamento, l'inserimento, l'eliminazione e l'aggiornamento. Questo approccio consente inoltre di utilizzare le espressioni di associazione bidirezionali. Per ulteriori informazioni sui controlli origine dati, vedere Cenni preliminari sui controlli origine dati.

  • Utilizzando la proprietà DataSource, che consente di eseguire l'associazione a vari oggetti, tra cui i DataSet ADO.NET, i lettori dati e le strutture in memoria quali gli insiemi. Questa opzione richiede la scrittura di codice per qualsiasi funzionalità aggiuntiva, ad esempio l'ordinamento, lo spostamento e l'aggiornamento.

Torna all'inizio

Creazione di modelli per il controllo ListView

Gli elementi visualizzati da un controllo ListView sono definiti dai modelli, similmente ai controlli DataList e Repeater. Il controllo ListView consente visualizzare i dati come elementi singoli o in gruppi.

Il layout principale (radice) di un controllo ListView viene definito creando un modello LayoutTemplate. LayoutTemplate deve includere un controllo che funge da segnaposto per i dati. Ad esempio, il modello di layout può includere un controllo ASP.NET Table, Panel o Label. Può altresì includere elementi HTML table, div o span il cui attributo runat è impostato su "server". Questi controlli conterranno l'output per ogni elemento in base a quanto definito dal modello ItemTemplate, che può essere raggruppato nel contenuto definito dal modello GroupTemplate.

Il contenuto per gli elementi singoli viene definito nel modello ItemTemplate. Questo modello contiene in genere i controlli associati a dati a colonne di dati o ad altri elementi dati singoli.

Raggruppamento di elementi

Se lo si desidera, è possibile raggruppare gli elementi di un controllo ListView utilizzando il modello GroupTemplate. In genere gli elementi vengono raggruppati al fine di creare un layout di tabella affiancato. In un layout di tabella affiancato, gli elementi sono ripetuti in una riga per il numero di volte specifico nella proprietà GroupItemCount. Per creare un layout di tabella affiancato, il modello di layout può contenere un controllo ASP.NET Table o un elemento HTML table il cui attributo runat è impostato su "server". Il modello di gruppo può contenere quindi un controllo ASP.NET TableRow o un elemento HTML tr. Il modello di elementi può contenere singoli controlli inclusi in un controllo ASP.NET TableCell o in un elemento HTML td.

È possibile utilizzare il modello EditItemTemplate per fornire l'interfaccia utente con associazione a dati che consente agli utenti di modificare gli elementi dati esistenti. È possibile utilizzare il modello InsertItemTemplate per definire l'interfaccia utente con associazione a dati che consente agli utenti di aggiungere un nuovo elemento dati. Per ulteriori informazioni, vedere Modifica dei dati più avanti in questo argomento.

Modelli disponibili

Nella tabella riportata di seguito vengono elencati i modelli utilizzati con il controllo ListView.

  • LayoutTemplate
    Identifica il modello radice che definisce il layout principale del controllo. Contiene un oggetto segnaposto, ad esempio una riga di tabella (tr), div o l'elemento span. Questo elemento verrà sostituito con il contenuto definito nel modello ItemTemplate o nel modello GroupTemplate. Può inoltre contenere un oggetto DataPager.

  • ItemTemplate
    Identifica il contenuto con associazione a dati da visualizzare per i soli elementi.

  • ItemSeparatorTemplate
    Identifica il contenuto di cui eseguire il rendering tra i soli elementi.

  • GroupTemplate
    Identifica il contenuto per il layout di gruppo. Contiene un oggetto segnaposto, ad esempio una cella di tabella (td), div o span, che verrà sostituito con il contenuto definito negli altri modelli, ad esempio i modelli ItemTemplate e EmptyItemTemplate.

  • GroupSeparatorTemplate
    Identifica il contenuto di cui eseguire il rendering tra i gruppi di elementi.

  • EmptyItemTemplate
    Identifica il contenuto di cui eseguire il rendering per un elemento vuoto quando viene utilizzato un modello GroupTemplate. Ad esempio, se la proprietà GroupItemCount è impostata su 5 e il numero complessivo di elementi restituiti dall'origine dati è 8, l'ultima riga di dati visualizzata dal controllo ListView conterrà tre elementi, in base a quanto specificato dal modello ItemTemplate, e due elementi in base a quanto specificato dal modello EmptyItemTemplate.

  • EmptyDataTemplate
    Identifica il contenuto di cui eseguire il rendering se l'origine dati non restituisce dati.

  • SelectedItemTemplate
    Identifica il contenuto di cui eseguire il rendering per l'elemento dati selezionato al fine di differenziare l'elemento selezionato dagli altri elementi visualizzati.

  • AlternatingItemTemplate
    Identifica il contenuto di cui eseguire il rendering per gli elementi alternati al fine di rendere più semplice la distinzione tra elementi consecutivi.

  • EditItemTemplate
    Identifica il contenuto di cui eseguire il rendering quando un elemento viene modificato. Viene eseguito il rendering del modello EditItemTemplate anziché del modello ItemTemplate per l'elemento dati in corso di modifica.

  • InsertItemTemplate
    Identifica il contenuto di cui eseguire il rendering quando un elemento viene inserito. Viene eseguito il rendering del modello InsertItemTemplate anziché di un modello ItemTemplate all'inizio o alla fine degli elementi visualizzati dal controllo ListView. È possibile specificare dove eseguire il rendering del modello InsertItemTemplate utilizzando la proprietà InsertItemPosition del controllo ListView.

Creazione di un modello di elementi

Nell'esempio seguente viene mostrata la struttura di base di un modello di elementi.

<asp:ListView  ID="ListView1" 
    DataSourceID="SqlDataSource1">
  <LayoutTemplate>
    <table  id="table1"  >
      <tr  id="itemPlaceholder" ></tr>
    </table>
  </LayoutTemplate>
  <ItemTemplate>
    <tr runat="server>
      <td >
        <%-- Data-bound content. --%>
        <asp:Label ID="NameLabel"  
          Text='<%#Eval("Name") %>' />
      </td>
    </tr>
  </ItemTemplate>
</asp:ListView>

Per visualizzare individualmente gli elementi, si aggiunge un controllo lato server al modello LayoutTemplate e si imposta la proprietà ID del controllo su itemPlaceholder. Questo controllo è solo un segnaposto per altri modelli, generalmente per il modello ItemTemplate. Di conseguenza, in fase di esecuzione questo controllo verrà sostituito con il contenuto di altri modelli.

Nota:

È possibile modificare il valore della proprietà ID utilizzata per identificare il contenitore degli elementi impostando la proprietà ItemPlaceholderID su un nuovo valore.

Dopo avere definito il modello di layout, viene aggiunto un modello ItemTemplate, che in genere contiene i controlli per visualizzare il contenuto con associazione a dati. È possibile specificare il markup da utilizzare per visualizzare ogni elemento utilizzando il metodo Eval per associare i controlli ai valori dell'origine dati. Per ulteriori informazioni sul metodo Eval, vedere Cenni preliminari sulle espressioni di associazione dati.

È possibile fornire contenuto aggiuntivo di cui eseguire il rendering utilizzando il modello ItemSeparatorTemplate, che identifica il contenuto da includere tra elementi.

Nell'illustrazione seguente viene mostrato un layout che visualizza i dati dell'origine dati utilizzando più righe di tabella per elemento.

Nell'esempio riportato di seguito viene illustrato come creare il layout.

<asp:ListView  ID="EmployeesListView" 
    DataSourceID="EmployeesDataSource" 
    DataKeyNames="EmployeeID">
  <LayoutTemplate>
    <table cellpadding="2"  id="tblEmployees" 
        style="width:460px">
      <tr  id="itemPlaceholder">
      </tr>
    </table>
    <asp:DataPager  ID="DataPager" PageSize="3">
      <Fields>
        <asp:NumericPagerField
          ButtonCount="5"
          PreviousPageText="<--"
          NextPageText="-->" />
      </Fields>
    </asp:DataPager>
  </LayoutTemplate>
  <ItemTemplate>
     <tr >
       <td valign="top" colspan="2" align="center" 
           class="EmployeeName">
         <asp:Label ID="FirstNameLabel"  
           Text='<%#Eval("FirstName") %>' />
         <asp:Label ID="LastNameLabel"  
           Text='<%#Eval("LastName") %>' />
       </td>
     </tr>
     <tr style="height:72px" >
       <td valign="top" class="EmployeeInfo">
         <asp:Label ID="JobTitleLabel"  
             Text='<%#Eval("JobTitle") %>' />
         <br />
         <asp:HyperLink ID="EmailAddressLink"  
             Text='<%#Eval("EmailAddress") %>'  
             href='<%#"mailto:" + Eval("EmailAddress") %>' />
         <br />
         <asp:Label ID="PhoneLabel"  
             Text='<%#Eval("Phone") %>' />
       </td>
       <td valign="top" class="EmployeeAddress">
         <asp:Label ID="AddressLine1Label"  
             Text='<%#Eval("AddressLine1") %>' />
         <br />
         <asp:Panel ID="AddressLine2Panel"  
            Visible='<%#Eval("AddressLine2").ToString() != String.Empty %>'>
         <asp:Label ID="AddressLine2Label"  
            Text='<%#Eval("AddressLine2").ToString()%>'  />
         <br />
         </asp:Panel>
         <asp:Label ID="CityLabel"  
           Text='<%#Eval("City") %>' />,
         <asp:Label ID="StateProvinceNameLabel"  
           Text='<%#Eval("StateProvinceName") %>' />
         <asp:Label ID="PostalCodeLabel"  
           Text='<%#Eval("PostalCode") %>' />
         <br />
         <asp:Label ID="CountryRegionNameLabel"  
           Text='<%#Eval("CountryRegionName") %>' />
       </td>
     </tr>
   </ItemTemplate>
</asp:ListView>

Creazione di un modello di gruppo

Nell'esempio riportato di seguito viene mostrato come creare un modello di gruppo.

<asp:ListView  ID="ListView1" 
    DataSourceID="SqlDataSource1" 
    GroupItemCount="5">
  <LayoutTemplate>
    <table  id="table1">
      <tr  id="groupPlaceholder">
      </tr>
    </table>
  </LayoutTemplate>
  <GroupTemplate>
    <tr  id="tableRow">
      <td  id="itemPlaceholder" />
    </tr>
  </GroupTemplate>
  <ItemTemplate>
    <td >
      <%-- Data-bound content. --%>
      <asp:Label ID="NameLabel"  
          Text='<%#Eval("Name") %>' />
    </td>
  </ItemTemplate>
</asp:ListView>

Per visualizzare gli elementi in gruppi, si utilizza un controllo server nel modello LayoutTemplate che funge da segnaposto per il gruppo. È ad esempio possibile utilizzare un controllo TableRow. Si imposta la proprietà ID del controllo segnaposto su groupPlaceholder. In fase di esecuzione questo controllo segnaposto verrà sostituito con il contenuto del modello GroupTemplate.

Si aggiunge quindi un controllo segnaposto e se ne imposta la proprietà ID su itemPlaceholder. Questo controllo è solo un segnaposto per altri modelli, generalmente per il modello ItemTemplate. Di conseguenza, in fase di esecuzione questo controllo verrà sostituito con il contenuto di altri modelli. Il contenuto viene ripetuto per il numero di elementi specificato dalla proprietà GroupItemCount del controllo ListView.

Infine, si aggiunge un modello ItemTemplate con il contenuto con associazione a dati da visualizzare nel controllo contenitore per ogni elemento.

Nota:

È possibile modificare il valore della proprietà ID utilizzata per identificare il segnaposto del gruppo impostando un nuovo valore per la proprietà GroupPlaceholderID.

È possibile specificare un separatore tra elementi utilizzando il modello ItemSeparatorTemplate. È possibile specificare un separatore tra gruppi utilizzando la proprietà GroupSeparatorTemplate.

Nell'illustrazione seguente viene mostrato un layout che visualizza più elementi dell'origine dati per riga.

Nell'esempio riportato di seguito viene illustrato come creare il layout.

<asp:ListView  ID="ProductsListView"
    GroupItemCount="3"
    DataSourceID="ProductsSqlDataSource" DataKeyNames="ProductID">
  <LayoutTemplate>
    <table cellpadding="2" 
           id="tblProducts" style="height:320px">
      <tr  id="groupPlaceholder">
      </tr>
    </table>
    <asp:DataPager  ID="DataPager"
                   PageSize="9">
       <Fields>
         <asp:NumericPagerField ButtonCount="3"
              PreviousPageText="<--"
              NextPageText="-->" />
       </Fields>
    </asp:DataPager>
  </LayoutTemplate>
  <GroupTemplate>
    <tr  id="productRow"
        style="height:80px">
      <td  id="itemPlaceholder">
      </td>
    </tr>
  </GroupTemplate>
  <ItemTemplate>
    <td valign="top" align="center" style="width:100" >
      <asp:Image ID="ProductImage" 
           ImageUrl='<%#"~/images/thumbnails/" + 
               Eval("ThumbnailPhotoFileName") %>'
           Height="49" /><br />
      <asp:HyperLink ID="ProductLink" 
           Target="_blank" Text='<% #Eval("Name")%>'
           href='<%#"ShowProduct.aspx?ProductID=" + 
              Eval("ProductID") %>' />
    </td>
  </ItemTemplate>
</asp:ListView>

Torna all'inizio

Spostamento tra i dati

Per consentire agli utenti di spostarsi tra i dati di un controllo ListView, è possibile utilizzare un controllo DataPager. Il controllo DataPager può trovarsi all'interno del modello LayoutTemplate o in una pagina esterna al controllo ListView. Se il controllo DataPager non si trova nel controllo ListView, è necessario impostare la proprietà PagedControlID sull'ID del controllo ListView.

Il controllo DataPager supporta l'interfaccia di spostamento incorporata. È possibile utilizzare l'oggetto NumericPagerField, che consente agli utenti di selezionare una pagina di dati in base al numero di pagina. È inoltre possibile utilizzare l'oggetto NextPreviousPagerField. Ciò consente agli utenti di spostarsi nelle pagine di dati una pagina alla volta o di passare alla prima o all'ultima pagina di dati. La dimensione delle pagine di dati viene impostata mediante la proprietà PageSize del controllo DataPager. È possibile utilizzare uno o più oggetti campo pager in un unico controllo DataPager.

Inoltre è possibile creare un'interfaccia di spostamento personalizzata mediante l'oggetto TemplatePagerField. Nel modello TemplatePagerField è possibile fare riferimento al controllo DataPager utilizzando la proprietà Container, che fornisce l'accesso alle proprietà del controllo DataPager. Queste proprietà includono l'indice della riga iniziale, la dimensione della pagina e il numero complessivo di righe attualmente associati al controllo ListView.

Nell'esempio seguente viene illustrata una classe DataPager inclusa nel modello LayoutTemplate di un controllo ListView.

<asp:ListView  ID="ListView1" 
    DataSourceID="SqlDataSource1">
  <LayoutTemplate>
    <table  id=" table1">
      <tr  id="itemPlaceholder">
      </tr>
    </table>
    <asp:DataPager  ID="DataPager" PageSize="5">
        <Fields>
          <asp:NumericPagerField ButtonCount="10"
               PreviousPageText="<--"
               NextPageText="-->" />
        </Fields>
    </asp:DataPager>
  </LayoutTemplate>
  <ItemTemplate>
    <tr >
      <%-- Data-bound content. --%>
    </tr>
  </ItemTemplate>
</asp:ListView>

Nell'illustrazione seguente viene mostrato un layout che visualizza i collegamenti alle pagine di dati in base al numero di pagina mediante l'oggetto NumericPagerField.

Nell'esempio riportato di seguito viene illustrato come creare il layout.

<asp:DataPager  ID="DataPager" PageSize="10">
  <Fields>
    <asp:NumericPagerField ButtonCount="10"
         CurrentPageLabelCssClass="CurrentPage"
         NumericButtonCssClass="PageNumbers"
         NextPreviousButtonCssClass="PageNumbers" NextPageText=" > "
         PreviousPageText=" < " />
  </Fields>
</asp:DataPager>

Nell'illustrazione seguente viene mostrata l'interfacci di spostamento che visualizza i collegamenti alla pagina successiva e precedente nonché alla prima e all'ultima pagina di dati mediante l'oggetto NextPreviousPagerField. L'interfaccia di spostamento include inoltre contenuto personalizzato derivante da un modello TemplatePagerField, che visualizza l'intervallo di numeri di elementi corrente e il numero complessivo di elementi. Il modello TemplatePagerField include una casella di testo in cui gli utenti possono immettere il numero di un elemento al quale spostarsi. L'elemento specificato viene visualizzato come primo elemento della pagina.

Nell'esempio riportato di seguito viene illustrato come creare l'interfaccia di spostamento.

<asp:DataPager  ID="EmployeesDataPager" PageSize="8">
  <Fields>
    <asp:TemplatePagerField>
      <PagerTemplate>
        &nbsp;
        <asp:TextBox ID="CurrentRowTextBox" 
             AutoPostBack="true"
             Text="<%# Container.StartRowIndex + 1%>" 
             Columns="1" 
             style="text-align:right" 
             OnTextChanged="CurrentRowTextBox_OnTextChanged" />
        to
        <asp:Label ID="PageSizeLabel"  Font-Bold="true"
             Text="<%# Container.StartRowIndex + Container.PageSize > Container.TotalRowCount ? Container.TotalRowCount : Container.StartRowIndex + Container.PageSize %>" />
        of
        <asp:Label ID="TotalRowsLabel"  Font-Bold="true"
             Text="<%# Container.TotalRowCount %>" />
      </PagerTemplate>
    </asp:TemplatePagerField>
    <asp:NextPreviousPagerField 
         ShowFirstPageButton="true" ShowLastPageButton="true"
         FirstPageText="|<< " LastPageText=" >>|"
         NextPageText=" > " PreviousPageText=" < " />
  </Fields>
</asp:DataPager>

Nell'esempio riportato di seguito viene illustrato il gestore eventi per l'evento TextChanged del controllo TextBox incluso nel modello TemplatePagerField. Il codice del gestore si sposta all'elemento dati specificato dall'utente.

Protected Sub CurrentRowTextBox_OnTextChanged(ByVal sender As Object, _
        ByVal e As EventArgs) 
    Dim t As TextBox = CType(sender, TextBox)
    Dim pager As DataPager = _
        CType(EmployeesListView.FindControl("EmployeesDataPager"), _
        DataPager)
    pager.SetPageProperties(Convert.ToInt32(t.Text) - 1, _
        pager.PageSize, True)
End Sub

protected void CurrentRowTextBox_OnTextChanged(object sender, 
    EventArgs e)
{
    TextBox t = (TextBox)sender;
    DataPager pager = 
        (DataPager)EmployeesListView.FindControl("EmployeesDataPager");
    pager.SetPageProperties(Convert.ToInt32(t.Text) - 1, 
         pager.PageSize, true);
}

Torna all'inizio

Ordinamento dei dati

È possibile ordinare i dati visualizzati in un controllo ListView aggiungendo un pulsante al modello LayoutTemplate e impostando la proprietà CommandName del pulsante su "Sort". La proprietà CommandArgument del pulsante viene impostata sul nome della colonna in base alla quale eseguire l'ordinamento. Facendo clic ripetutamente sul pulsante Sort si passa dall'ordinamento Ascending all'ordinamento Descending e viceversa.

È possibile specificare più nomi di colonna nella proprietà CommandArgument del pulsante Sort. Tuttavia, il controllo ListView applica il tipo di ordinamento all'elenco completo delle colonne. Di conseguenza, il tipo di ordinamento si applica solo all'ultima colonna dell'elenco. Ad esempio, se CommandArgument contiene "LastName, FirstName", facendo clic ripetutamente sul pulsante Sort si produce un'espressione di ordinamento quale "LastName, FirstName ASC" o "LastName, FirstName DESC".

Nell'esempio seguente viene mostrato un controllo ListView che include un pulsante Sort per ordinare i dati in base al cognome.

<asp:ListView  ID="ListView1" DataSourceID="SqlDataSource1">
  <LayoutTemplate>
    <asp:LinkButton  ID="SortButton" 
         Text="Sort" CommandName="Sort" CommandArgument="LastName" />
    <table  id="table1">
      <tr  id="itemPlaceholder">
      </tr>
    </table>
    <asp:DataPager  ID="DataPager" PageSize="20">
        <Fields>
          <asp:NumericPagerField ButtonCount="10"
               PreviousPageText="<--"
               NextPageText="-->" />
        </Fields>
    </asp:DataPager>
  </LayoutTemplate>
  <ItemTemplate>
    <tr >
      <td><asp:Label  ID="FirstNameLabel" 
               Text='<%# Eval("FirstName")' /></td>
      <td><asp:Label  ID="LastNameLabel" 
               Text='<%# Eval("LastName")' /></td>
    </tr>
  </ItemTemplate>
</asp:ListView>

Impostazione dinamica dell'espressione di ordinamento

È possibile creare un ordinamento personalizzato impostando dinamicamente l'espressione di ordinamento di un controllo ListView. A tale scopo, chiamare il metodo Sort o gestire l'evento Sorting.

Nell'esempio riportato di seguito viene illustrato un gestore per l'evento Sorting. Il codice applica lo stesso tipo di ordinamento a tutte le colonne della proprietà SortExpression.

Protected Sub ContactsListView_Sorting(ByVal sender As Object, _
        ByVal e As ListViewSortEventArgs)

    If (String.IsNullOrEmpty(e.SortExpression)) Then Return

    Dim direction As String = ""
    If Not (ViewState("SortDirection") Is Nothing) Then
        direction = ViewState("SortDirection").ToString()
    End If
    
    If direction = "ASC" Then
        direction = "DESC"
    Else
        direction = "ASC"
    End If

    ViewState("SortDirection") = direction

    Dim sortColumns As String() = e.SortExpression.Split(","c)
    Dim sortExpression As String = sortColumns(0) & " " & direction
    Dim i As Integer
    For i = 1 To sortColumns.Length - 1
        sortExpression += ", " & sortColumns(i) & " " & direction
    Next i
    e.SortExpression = sortExpression
    
  End Sub

protected void EmployeesListView_OnSorting(object sender, 
        ListViewSortEventArgs e)
{
    if (String.IsNullOrEmpty(e.SortExpression)) { return; }
    string direction = "";
    if (ViewState["SortDirection"] != null)
        direction = ViewState["SortDirection"].ToString();

    if (direction == "ASC")
        direction = "DESC";
    else
        direction = "ASC";

    ViewState["SortDirection"] = direction;

    string[] sortColumns = e.SortExpression.Split(',');
    string sortExpression = sortColumns[0] + " " + direction;
    for (int i = 1; i < sortColumns.Length; i++)
        sortExpression += ", " + sortColumns[i] + " " + direction;
    e.SortExpression = sortExpression;
}

Torna all'inizio

Modifica dei dati

È possibile creare modelli per il controllo ListView che consentono agli utenti di modificare, inserire o eliminare un singolo elemento dati.

Per consentire agli utenti di modificare un elemento dati, è possibile aggiungere un modello EditItemTemplate al controllo ListView. Quando un elemento viene trasferito alla modalità di modifica, il controllo ListView lo visualizza mediante il modello di modifica, che deve includere controlli con associazione a dati nei quali l'utente può modificare i valori. Ad esempio, il modello può includere caselle di testo in cui gli utenti possono modificare i valori esistenti.

Per consentire agli utenti di inserire un nuovo elemento, è possibile aggiungere un modello InsertItemTemplate al controllo ListView. Come accade con il modello di modifica, il modello di inserimento deve includere controlli con associazione a dati che consentono l'immissione di dati. Il rendering del modello InsertItemTemplate viene eseguito all'inizio o alla fine degli elementi visualizzati. Si specifica dove eseguire il rendering del modello InsertItemTemplate utilizzando la proprietà InsertItemPosition del controllo ListView.

In genere ai modelli vengono aggiunti dei pulsanti per consentire agli utenti di specificare l'azione che intendono intraprendere. Ad esempio, è possibile aggiungere un pulsante Elimina al modello di un elemento per consentire agli utenti di eliminare tale elemento.

È possibile aggiungere un pulsante Modifica al modello di un elemento per consentire all'utente di passare alla modalità di modifica. In EditItemTemplate è possibile includere un pulsante Aggiorna che consente agli utenti di salvare le modifiche. È inoltre possibile includere un pulsante Annulla che consente agli utenti di tornare alla modalità di visualizzazione senza salvare le modifiche.

Si definisce l'azione eseguita da un pulsante impostandone la proprietà CommandName. Nella tabella riportata di seguito vengono elencati i valori della proprietà CommandName per i quali il controllo ListView ha il comportamento incorporato.

  • Select
    Visualizza il contenuto del modello SelectedItemTemplate per l'elemento selezionato.

  • Insert
    In un modello InsertItemTemplate, specifica che il contenuto dei controlli con associazione a dati deve essere salvato nell'origine dati.

  • Edit
    Specifica che il controllo ListView deve passare alla modalità di modifica e deve visualizzare l'elemento utilizzando il modello EditItemTemplate.

  • Update
    In un modello EditItemTemplate, specifica che il contenuto dei controlli con associazione a dati deve essere salvato nell'origine dati.

  • Delete
    Elimina l'elemento dall'origine dati.

  • Cancel
    Annulla l'azione corrente. Quando viene visualizzato il modello EditItemTemplate, l'annullamento dell'azione fa sì che venga visualizzato il modello SelectedItemTemplate qualora l'elemento sia quello attualmente selezionato; in caso contrario viene visualizzato il modello ItemTemplate. Quando viene visualizzato il modello InsertItemTemplate, l'annullamento dell'azione fa sì che venga visualizzato un modello InsertItemTemplate vuoto.

  • (Valore personalizzato)
    Per impostazione predefinita, non viene eseguita alcuna azione. È possibile fornire un valore personalizzato per la proprietà CommandName. Nell'evento ItemCommand è quindi possibile testare il valore e intraprendere l'azione.

Per un esempio di un controllo ListView configurato per consentire la modifica, l'eliminazione e l'inserimento, vedere Procedura dettagliata: modifica di dati tramite il controllo server Web ListView.

Torna all'inizio

Applicazione di stili agli elementi ListView

Il controllo ListView non supporta le proprietà di stile quali BackColor e Font. Per applicare gli stili al controllo ListView, è necessario utilizzare le classi CSS o gli elementi di stile inline per i controlli singoli nei modelli ListView.

Alcuni oggetti supportano proprietà che consentono di applicare uno stile agli elementi dell'output. Ad esempio, nell'oggetto NumericPagerField sono incluse le proprietà seguenti:

  • Una proprietà NumericButtonCssClass che consente di specificare il nome della classe CSS per i pulsanti che consentono lo spostamento tra le pagine di dati in base al numero.

  • Una proprietà CurrentPageLabelCssClass che consente di specificare il nome della classe CSS per il numero di pagina corrente.

  • Una proprietà NextPreviousButtonCssClass che consente di specificare il nome della classe CSS per i pulsanti che consentono lo spostamento al gruppo precedente o successivo di pulsanti numerici.

Torna all'inizio

Riferimento alle classi

Nella tabella riportata di seguito sono elencate le classi principali correlate al controllo ListView.

Classe

Descrizione

ListView

Un controllo server che visualizza i valori di un'origine dati utilizzando modelli definiti dall'utente. È possibile configurare il controllo per consentire agli utenti di selezionare, ordinare, eliminare, modificare e inserire i record.

ListViewItem

Un oggetto che rappresenta un elemento nel controllo ListView.

ListViewDataItem

Un oggetto che rappresenta un elemento dati nel controllo ListView.

ListViewItemType

Un'enumerazione che identifica la funzione degli elementi in un controllo ListView.

DataPager

Un controllo server che fornisce la funzionalità di spostamento per i controlli che implementano l'interfaccia IPageableItemContainer, ad esempio il controllo ListView.

NumericPagerField

Un campo DataPager che consente agli utenti di selezionare una pagina di dati in base al numero di pagina.

NextPreviousPagerField

Un campo DataPager che consente agli utenti di spostarsi nelle pagine di dati una pagina alla volta o di passare alla prima o all'ultima pagina di dati.

TemplatePagerField

Un campo DataPager che consente agli utenti di creare un'interfaccia di spostamento personalizzata.

Torna all'inizio

Esempi di codice

Nelle sezioni seguenti sono inclusi gli esempi di codice per l'utilizzo del controllo ListView.

Argomenti relativi alle procedure e alle procedure dettagliate

Procedura dettagliata: visualizzazione, paging e ordinamento di dati tramite il controllo server Web ListView

Procedura dettagliata: modifica di dati tramite il controllo server Web ListView

Torna all'inizio

Vedere anche

Concetti

Cenni preliminari sui controlli server Web ASP.NET con associazione a dati

Associazione a database

Cenni preliminari sui controlli origine dati

Altre risorse

Globalizzazione e localizzazione ASP.NET

Accesso facilitato ASP.NET