Procedura: personalizzare l'aspetto e il comportamento dei campi dati di un controllo Dynamic Data

Articolo
10/22/2014

Aggiornamento: novembre 2007

ASP.NET Dynamic Data utilizza modelli di campo per eseguire il rendering di ogni campo dati di una tabella. I modelli di campo sono in genere controlli utente (file ASCX) di cui viene eseguito il mapping a tipi di dati Common Language Runtime (CLR), determinati dal tipo di dati del database. Di solito, ASP.NET Dynamic Data fornisce un controllo utente per la visualizzazione dei dati di ogni tipo e un altro per la modifica o l'inserimento dei dati di tale tipo.

In questo argomento viene descritto come personalizzare l'aspetto e il comportamento di un campo dati mediante l'impostazione della proprietà UIHint in un controllo Dynamic Data quale il controllo DynamicControl e il campo DynamicField. La proprietà UIHint specifica il modello di campo da utilizzare quando viene eseguito il rendering di un campo dati specifico da parte di uno di questi oggetti. La proprietà UIHint può puntare a uno dei modelli forniti o a uno nuovo creato dall'utente. Questo approccio è utile quando non si utilizzano pagine create automaticamente da Dynamic Data, ma si creano pagine Web personalizzate per visualizzare e modificare i dati.

In alternativa, è possibile modificare la visualizzazione e l'aspetto del campo dati in tutta l'applicazione mediante attributi. Per ulteriori informazioni, vedere la classe Procedura: personalizzare l'aspetto e il comportamento dei campi dati nel modello di dati.

Per personalizzare l'aspetto e il comportamento di un campo dati in un controllo con associazione a dati

Se lo si desidera, creare un modello di campo personalizzato che definisca l'interfaccia utente per un campo dati specifico nel modello di dati. Per ulteriori informazioni, vedere Procedura: personalizzare la visualizzazione dei campi dati nel modello di dati.

Se si utilizzano i controlli GridView o DetailsView, aggiungere un oggetto DynamicField e impostarne la proprietà UIHint sul nome del modello di campo da utilizzare per la visualizzazione dei dati.

Nell'esempio riportato di seguito viene illustrato come utilizzare un controllo DynamicField in un campo per eseguire il rendering della colonna ProductName mediante un modello di campo denominato RedText. In modalità di visualizzazione i dati vengono visualizzati mediante un modello di campo denominato RedText.ascx. In modalità di modifica o di inserimento i dati vengono visualizzati mediante un modello di campo denominato RedText_Edit.ascx.

<asp:DynamicField
  UIHint="RedText"
  DataField="ProductName" />

Nota:
Se il modello di campo specificato non viene trovato, Dynamic Data utilizza un meccanismo di fallback. Per ulteriori informazioni, vedere la classe Cenni preliminari sui modelli di campo di ASP.NET Dynamic Data.

Se si utilizzano controlli con associazione a dati che si avvalgono di modelli o di campi modello, ad esempio i controlli ListView o FormView, aggiungere un controllo DynamicControl per visualizzare i dati e impostarne la proprietà UIHint sul nome del campo dati da visualizzare.

Nell'esempio riportato di seguito viene specificato che verrà eseguito il rendering della colonna ProductName mediante un modello di campo denominato RedText quando l'elemento è in modalità di modifica. In fase di esecuzione Dynamic Data cercherà un controllo utente denominato RedText_Edit.ascx.
```
<EditItemTemplate>
  <asp:DynamicControl 
    Mode="Edit"
    UIHint="RedText"
    DataField="ProductName" />
</EditItemTemplate>
```

Esempio

Nell'esempio riportato di seguito viene illustrato come aggiungere la proprietà UIHint a un campo DynamicField di un controllo GridView. La proprietà viene impostata in modo che il campo dati utilizzi un modello di campo personalizzato che visualizza un controllo Calendar per la modifica della data non più disponibile. Nel secondo e terzo esempio viene illustrato il codice del controllo utente per i modelli di campo che definiscono l'interfaccia utente per la visualizzazione della data in formato breve e per la modifica del campo.

<%@ Page Language="VB" %>

<script >

  Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs)
    DynamicDataManager1.RegisterControl(ProductsGridView)
  End Sub

</script>

<!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" >
    <title>UIHint Property Sample</title>
    <link href="~/Site.css" rel="stylesheet" type="text/css" />
</head>
<body>

  <form id="form1" >
    <div>
      <h2><%= ProductsDataSource.TableName%> table</h2>

      <asp:DynamicDataManager ID="DynamicDataManager1" 
        AutoLoadForeignKeys="true" />

      <asp:ScriptManager ID="ScriptManager1"  EnablePartialRendering="true"/>

      <asp:UpdatePanel ID="UpdatePanel1" >
        <ContentTemplate>        

          <asp:GridView ID="ProductsGridView"  DataSourceID="ProductsDataSource"
            AutoGenerateEditButton="true"
            AutoGenerateColumns="false"
            AllowSorting="true"
            AllowPaging="true">
            <Columns>
              <asp:DynamicField DataField="Name" />
              <asp:DynamicField DataField="ProductNumber" />
              <asp:DynamicField DataField="DiscontinuedDate" UIHint="DateCalendar" />
            </Columns>        
            <EmptyDataTemplate>
              There are currently no items in this table.
            </EmptyDataTemplate>
          </asp:GridView>

          <!-- This example uses Microsoft SQL Server and connects   -->
          <!-- to the AdventureWorksLT sample database.              -->
          <asp:LinqDataSource ID="ProductsDataSource"  
            EnableUpdate="true"
            TableName="Products" 
            ContextTypeName="AdventureWorksLTDataContext" />

          </ContentTemplate>
        </asp:UpdatePanel>

    </div>
  </form>
</body>
</html>

<%@ Page Language="C#" %>

<script >

  protected void Page_Init(object sender, EventArgs e) 
  {
    DynamicDataManager1.RegisterControl(ProductsGridView);
  }

</script>

<!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" >
    <title>UIHint Property Sample</title>
    <link href="~/Site.css" rel="stylesheet" type="text/css" />
</head>
<body>

  <form id="form1" >
    <div>
      <h2><%= ProductsDataSource.TableName%> table</h2>

      <asp:DynamicDataManager ID="DynamicDataManager1" 
        AutoLoadForeignKeys="true" />

      <asp:ScriptManager ID="ScriptManager1"  EnablePartialRendering="true"/>

      <asp:UpdatePanel ID="UpdatePanel1" >
        <ContentTemplate>        

          <asp:GridView ID="ProductsGridView"  DataSourceID="ProductsDataSource"
            AutoGenerateEditButton="true"
            AutoGenerateColumns="false"
            AllowSorting="true"
            AllowPaging="true">
            <Columns>
              <asp:DynamicField DataField="Name" />
              <asp:DynamicField DataField="ProductNumber" />
              <asp:DynamicField DataField="DiscontinuedDate" UIHint="DateCalendar" />
            </Columns>        
            <EmptyDataTemplate>
              There are currently no items in this table.
            </EmptyDataTemplate>
          </asp:GridView>

          <asp:LinqDataSource ID="ProductsDataSource"  
            EnableUpdate="true"
            TableName="Products" 
            ContextTypeName="AdventureWorksLTDataContext" />

          </ContentTemplate>
        </asp:UpdatePanel>

    </div>
  </form>
</body>
</html>

<%@ Control Language="VB" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >

  Function GetDateString() As String 
    If Not (FieldValue Is Nothing) Then
      Dim dt As DateTime = CType(FieldValue, DateTime)
      Return dt.ToShortDateString()
    Else
      Return String.Empty
    End If
  End Function
</script>

<%# GetDateString() %>

<%@ Control Language="C#" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >
    string GetDateString() 
    {
      if (FieldValue != null)
      {
        DateTime dt = (DateTime)FieldValue;
        return dt.ToShortDateString();
      }
      else
      {
        return string.Empty;
      }
    }
</script>

<%# GetDateString() %>

<%@ Control Language="VB" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >

  Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
    TextBox1.ToolTip = Column.Description

    SetUpValidator(RequiredFieldValidator1)
    SetUpValidator(RegularExpressionValidator1)
    SetUpValidator(DynamicValidator1)
  End Sub

  Protected Overrides Sub ExtractValues(ByVal dictionary As IOrderedDictionary)
    dictionary(Column.Name) = ConvertEditedValue(TextBox1.Text)
  End Sub

  Public Overrides ReadOnly Property DataControl() As Control
    Get
      Return TextBox1
    End Get
  End Property

  Protected Sub Calendar1_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs)
    TextBox1.Text = Calendar1.SelectedDate.ToString("d")
  End Sub

  Function GetDateString() As String
    If Not (FieldValue Is Nothing) Then
      Dim dt As DateTime = CType(FieldValue, DateTime)
      Return dt.ToShortDateString()
    Else
      Return String.Empty
    End If
  End Function

</script>

<asp:TextBox ID="TextBox1"  
  Text='<%# GetDateString() %>' 
  MaxLength="10">
</asp:TextBox>

<asp:Calendar ID="Calendar1"  
  VisibleDate='<%# IIf(FieldValue Is Nothing, DateTime.Now, FieldValue) %>'
  SelectedDate='<%# IIf(FieldValue Is Nothing, DateTime.Now, FieldValue) %>' 
  OnSelectionChanged="Calendar1_SelectionChanged" />

<asp:RequiredFieldValidator  ID="RequiredFieldValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:RegularExpressionValidator  ID="RegularExpressionValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />  
<asp:DynamicValidator  ID="DynamicValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" />

<%@ Control Language="C#" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >
    protected void Page_Load(object sender, EventArgs e) {
        TextBox1.ToolTip = Column.Description;

        SetUpValidator(RequiredFieldValidator1);
        SetUpValidator(RegularExpressionValidator1);
        SetUpValidator(DynamicValidator1);
    }

    protected override void ExtractValues(IOrderedDictionary dictionary) {
      dictionary[Column.Name] = ConvertEditedValue(TextBox1.Text);
    }

    public override Control DataControl
    {
      get
      {
        return TextBox1;
      }
    }  

    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
      TextBox1.Text = Calendar1.SelectedDate.ToString("d");
    }

    string GetDateString()
    {
      if (FieldValue != null)
      {
        DateTime dt = (DateTime)FieldValue;
        return dt.ToShortDateString();
      }
      else
      {
        return string.Empty;
      }
    }
</script>

<asp:TextBox ID="TextBox1"  
  Text='<%# GetDateString() %>' 
  MaxLength="10">
</asp:TextBox>

<asp:Calendar ID="Calendar1"  
  VisibleDate='<%# (FieldValue != null) ? FieldValue : DateTime.Now %>'
  SelectedDate='<%# (FieldValue != null) ? FieldValue : DateTime.Now %>'
  OnSelectionChanged="Calendar1_SelectionChanged" />

<asp:RequiredFieldValidator  ID="RequiredFieldValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:RegularExpressionValidator  ID="RegularExpressionValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />  
<asp:DynamicValidator  ID="DynamicValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" />

Compilazione del codice

Per questo esempio sono necessari i seguenti requisiti:

Sito Web Dynamic Data o applicazione Web Dynamic Data.
Database di esempio AdventureWorks o AdventureWorksLT. Per informazioni su come scaricare e installare il database di esempio di SQL Server, vedere Microsoft SQL Server Product Samples: Database (informazioni in lingua inglese) nel sito Web CodePlex. Assicurarsi di installare la versione del database di esempio appropriata per la versione di SQL Server in esecuzione (SQL Server 2005 o SQL Server 2008).
Classe LINQ to SQL configurata per l'accesso alla tabella Products del database AdventureWorks o AdventureWorksLT.
Oggetto contesto dati registrato per essere utilizzato da Dynamic Data nel file Global.asax.

Programmazione efficiente

Le seguenti condizioni possono generare un'eccezione:

Database non disponibile

Vedere anche

Condividi tramite

Procedura: personalizzare l'aspetto e il comportamento dei campi dati di un controllo Dynamic Data

Per personalizzare l'aspetto e il comportamento di un campo dati in un controllo con associazione a dati

Esempio

Compilazione del codice

Programmazione efficiente

Vedere anche

Attività

Concetti

Riferimenti

Risorse aggiuntive