Condividi tramite


Modelli dei controlli server Web ASP.NET

Aggiornamento: novembre 2007

La maggior parte dei controlli server Web è caratterizzata da un aspetto e un layout predefiniti, modificabili con l'impostazione delle proprietà o con l'utilizzo di stili. L'aspetto di alcuni controlli server Web può essere inoltre personalizzato, tramite l'uso di modelli.

Un modello è un insieme di elementi HTML e di controlli che costituiscono il layout di una porzione particolare di un controllo. Nel controllo server Web DataList, ad esempio, è possibile utilizzare una combinazione di elementi HTML e di controlli per creare il layout di ogni riga dell'elenco. Analogamente, il controllo server Web GridView consente di determinare l'aspetto predefinito per le righe della griglia. È tuttavia possibile personalizzare l'aspetto della griglia definendo diversi modelli per le singole colonne.

Nota:

I modelli sono diversi dagli stili. Un modello definisce il contenuto di una sezione di un controllo, ad esempio il contenuto di una riga del controllo DataList. Gli stili definiscono invece l'aspetto di elementi quali colore, tipo di carattere e così via. È possibile applicare gli stili all'intero controllo, ad esempio impostare il tipo di carattere per il controllo GridView, o ad elementi del modello.

I modelli sono costituiti da controlli HTML e controlli server incorporati. Quando il controllo viene eseguito nella pagina Web ASP.NET, l'infrastruttura del controllo esegue il rendering del contenuto del modello anziché del codice HTML predefinito per il controllo.

Controlli che supportano i modelli

Non tutti i controlli server Web supportano i modelli. Nella maggior parte dei casi, i modelli sono supportati da controlli complessi, tra cui GridView, DataList, Repeater, FormView, DetailsView, Login e altri controlli.

Ogni controllo è in grado di supportare un insieme di modelli leggermente diverso che specifica i layout di diverse porzioni del controllo, quali l'intestazione, il piè di pagina, la voce e la voce selezionata. A seconda di quali porzioni si desidera personalizzare, è possibile specificare un modello per qualcuna o per tutte. Nel controllo GridView è possibile specificare i modelli delle colonne, anziché delle righe.

Nella seguente tabella sono elencati i controlli server Web che supportano i modelli.

Controllo

Modelli

ChangePassword

  • ChangePasswordTemplate

  • SuccessTemplate

CompleteWizardStep

  • ContentTemplate

  • CustomNavigationTemplate

CreateUserWizard

  • HeaderTemplate

  • SideBarTemplate

  • StartNavigationTemplate

  • StepNavigation

  • FinishNavigation

CreateUserWizardStep

  • ContentTemplate

  • CustomNavigationTemplate

DataList

  • HeaderTemplate

  • FooterTemplate

  • ItemTemplate

  • AlternatingItemTemplate

  • SeparatorTemplate

  • SelectedItemTemplate

  • EditItemTemplate

DetailsView

  • HeaderTemplate

  • FooterTemplate

  • PagerTemplate

  • EmptyDataTemplate

FormView

  • ItemTemplate

  • EditItemTemplate

  • InsertItemTemplate

  • HeaderTemplate

  • FooterTemplate

  • PagerTemplate

  • EmptyDataTemplate

GridView

  • PagerTemplate

  • EmptyDataTemplate

ListView

  • LayoutTemplate

  • ItemTemplate

  • ItemSeparatorTemplate

  • GroupTemplate

  • GroupSeparatorTemplate

  • EmptyItemTemplate

  • EmptyDataTemplate

  • SelectedItemTemplate

  • AlternatingItemTemplate

  • EditItemTemplate

  • InsertItemTemplate

Login

  • LayoutTemplate

LoginView

  • AnonymousTemplate

  • LoggedInTemplate

Menu

  • DynamicTemplate

  • StaticTemplate

PasswordRecovery

  • QuestionTemplate

  • SuccessTemplate

  • UserNameTemplate

Repeater

  • HeaderTemplate

  • FooterTemplate

  • ItemTemplate

  • AlternatingItemTemplate

  • SeparatorTemplate

SiteMapPath

  • CurrentNodeTemplate

  • RootNodeTemplate

  • NodeTemplate

  • PathSeparatorTemplate

TemplatePagerField

  • PageTemplate

UpdatePanel

  • ContentTemplate

UpdateProgress

  • ProgressTemplate

Wizard

  • FinishNavigationTemplate

  • HeaderTemplate

  • StartNavigationTemplate

  • StepNavigationTemplate

  • SideBarTemplate

Creazione di modelli

È possibile creare i modelli direttamente nel file ASPX. I modelli vengono creati come dichiarazioni XML. Nell'esempio riportato di seguito viene illustrato come visualizzare un elenco di nomi, numeri di telefono e indirizzi di posta elettronica di dipendenti utilizzando i modelli nel controllo DataList. Il layout delle informazioni relative ai dipendenti viene specificato nel modello ItemTemplate utilizzando controlli con associazione a dati.

Nota:

Se si utilizza una finestra di progettazione visiva, ad esempio Visual Studio 2005, è possibile utilizzare uno strumento di sviluppo visivo per creare e modificare i modelli. Per ulteriori informazioni, vedere Procedura: creare modelli di controlli server Web tramite la finestra di progettazione.

<asp:datalist id="DataList1" >
  <HeaderTemplate>
  Employee List
  </HeaderTemplate>
  <ItemTemplate>
    <asp:label id="Label1"  
        Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'></asp:label>
    <asp:label id="Label2"  
        Text='<%# DataBinder.Eval(Container, "DataItem.PhoneNumber")%>'></asp:label>
    <asp:Hyperlink id="Hyperlink1"  
        Text='<%# DataBinder.Eval(Container, "DataItem.Email") %>'
        NavigateURL='<%# DataBinder.Eval(Container, "DataItem.Link") %>'>
    </asp:Hyperlink>
  </ItemTemplate>
</asp:datalist>
<asp:datalist id="DataList1" >
  <HeaderTemplate>
  Employee List
  </HeaderTemplate>
  <ItemTemplate>
    <asp:label id="Label1"  
        Text='<%# DataBinder.Eval(Container, "DataItem.EmployeeName")%>'></asp:label>
    <asp:label id="Label2"  
        Text='<%# DataBinder.Eval(Container, "DataItem.PhoneNumber")%>'></asp:label>
    <asp:Hyperlink id="Hyperlink1"  
        Text='<%# DataBinder.Eval(Container, "DataItem.Email") %>'
        NavigateURL='<%# DataBinder.Eval(Container, "DataItem.Link") %>'>
    </asp:Hyperlink>
  </ItemTemplate>
</asp:datalist>

Utilizzo dei modelli

Un controllo basato su modello crea un'istanza del contenuto del modello solo su richiesta. Ciò significa che le istanze dei controlli nel modello potrebbero non essere create quando si verifica l'evento di caricamento della pagina. Questo comportamento può influire sulla modalità di utilizzo di un controllo all'interno di un modello; non è infatti possibile presupporre che un'istanza di un controllo all'interno di un modello venga creata quando la pagina viene caricata.

I modelli nidificati così come i file master nidificati non vengono sottoposti a rendering in visualizzazione Progettazione di Visual Web Developer o Visual Studio 2005. Il rendering della nidificazione viene tuttavia eseguito in un browser.

Vedere anche

Concetti

Controlli server Web ASP.NET e stili CSS

Altre risorse

Accesso ai dati tramite ASP.NET