TemplateFields gebruiken in het GridView-besturingselement (VB)

door Scott Mitchell

PDF downloaden

Om flexibiliteit te bieden biedt GridView het TemplateField, dat wordt weergegeven met behulp van een sjabloon. Een sjabloon kan een combinatie van statische HTML, webbesturingselementen en gegevensbindingsyntaxis bevatten. In deze zelfstudie bekijken we hoe u TemplateField kunt gebruiken om een grotere mate van aanpassing te bereiken met het gridview-besturingselement.

Introductie

De GridView bestaat uit een set velden die aangeven welke eigenschappen van de DataSource velden moeten worden opgenomen in de weergegeven uitvoer, samen met hoe de gegevens worden weergegeven. Het eenvoudigste veldtype is het BoundField, dat een gegevenswaarde als tekst weergeeft. In andere veldtypen worden de gegevens weergegeven met alternatieve HTML-elementen. Het CheckBoxField wordt bijvoorbeeld weergegeven als een selectievakje waarvan de aangevinkte toestand afhankelijk is van de waarde van een opgegeven gegevensveld; ImageField geeft een afbeelding weer waarvan de bron van de afbeelding is gebaseerd op een opgegeven gegevensveld. Hyperlinks en knoppen waarvan de status afhankelijk is van een onderliggende gegevensveldwaarde, kunnen worden weergegeven met de veldtypen HyperLinkField en ButtonField.

Hoewel de veldtypen CheckBoxField, ImageField, HyperLinkField en ButtonField een alternatieve weergave van de gegevens mogelijk maken, zijn ze nog steeds redelijk beperkt met betrekking tot opmaak. Een Selectievakjeveld kan slechts één selectievakje weergeven, terwijl een ImageField slechts één afbeelding kan weergeven. Wat gebeurt er als een bepaald veld tekst, een selectievakje en een afbeelding moet weergeven, allemaal op basis van verschillende gegevensveldwaarden? Of wat als we de gegevens willen weergeven met een ander web besturingselement dan het selectievakje, de afbeelding, de HyperLink of de knop? Bovendien beperkt het BoundField de weergave tot één gegevensveld. Wat gebeurt er als we twee of meer gegevensveldwaarden in één GridView-kolom willen weergeven?

Ter ondersteuning van dit flexibiliteitsniveau biedt GridView het TemplateField, dat wordt weergegeven met behulp van een sjabloon. Een sjabloon kan een combinatie van statische HTML, webbesturingselementen en gegevensbindingsyntaxis bevatten. Bovendien heeft het TemplateField verschillende sjablonen die kunnen worden gebruikt om de rendering voor verschillende situaties aan te passen. Bijvoorbeeld, de ItemTemplate sjabloon wordt standaard gebruikt om de cel voor elke rij weer te geven, maar de EditItemTemplate sjabloon kan worden gebruikt om de interface aan te passen bij het bewerken van gegevens.

In deze zelfstudie bekijken we hoe u TemplateField kunt gebruiken om een grotere mate van aanpassing te bereiken met het gridview-besturingselement. In de voorgaande zelfstudie hebben we gezien hoe we de opmaak aanpassen op basis van de onderliggende gegevens met behulp van de DataBound en RowDataBound gebeurtenis-handlers. Een andere manier om de opmaak aan te passen op basis van de onderliggende gegevens is door opmaakmethoden aan te roepen vanuit een sjabloon. We zullen deze techniek ook bekijken in deze les.

Voor deze zelfstudie gebruiken we TemplateFields om het uiterlijk van een lijst met werknemers aan te passen. We zullen specifiek alle werknemers weergeven, maar we zullen de voor- en achternamen van de werknemer in één kolom zetten, de datum van hun indiensttreding in een kalenderbesturingselement plaatsen, en een statuskolom weergeven die aangeeft hoeveel dagen ze in dienst zijn bij het bedrijf.

Afbeelding 1: Drie TemplateFields worden gebruikt om de weergave aan te passen (klik om de afbeelding op volledige grootte weer te geven)

Stap 1: De gegevens binden aan de GridView

In rapportagescenario's waarin u TemplateFields moet gebruiken om het uiterlijk aan te passen, vind ik het gemakkelijkst om te beginnen met het maken van een GridView-besturingselement dat alleen BoundFields bevat en vervolgens om nieuwe TemplateFields toe te voegen of de bestaande BoundFields indien nodig te converteren naar TemplateFields. Laten we deze zelfstudie daarom starten door een GridView toe te voegen aan de pagina via de ontwerpfunctie en deze te binden aan een ObjectDataSource die de lijst met werknemers retourneert. Met deze stappen maakt u een GridView met BoundFields voor elk van de werknemersvelden.

Open de GridViewTemplateField.aspx pagina en sleep een GridView van de Gereedschapkist naar de ontwerper. Kies in de infolabel van GridView om een nieuw ObjectDataSource-besturingselement toe te voegen waarmee de methode van EmployeesBLL de GetEmployees() klasse wordt aangeroepen.

Afbeelding 2: Voeg een nieuw ObjectDataSource-besturingselement toe dat de GetEmployees() methode aanroept (klik om de afbeelding op volledige grootte weer te geven)

Door de GridView op deze manier te binden, wordt automatisch een BoundField toegevoegd voor elk van de werknemerseigenschappen: EmployeeID, , LastNameFirstName, Title, , HireDate, , ReportsToen Country. Laten we voor dit rapport de eigenschappen EmployeeID, ReportsTo, of Country niet weergeven. Als u deze BoundFields wilt verwijderen, kunt u het volgende doen:

• Klik in het dialoogvenster Velden op de link Kolommen bewerken in de smart tag van de GridView om dit dialoogvenster te openen. Selecteer vervolgens de BoundFields in de lijst linksonder en klik op de rode X-knop om het BoundField te verwijderen.
• Bewerk de declaratieve syntaxis van GridView handmatig uit de bronweergave, verwijder het <asp:BoundField> element voor het BoundField dat u wilt verwijderen.

Nadat u de EmployeeIDmarkeringen , ReportsToen Country BoundFields hebt verwijderd, moet de opmaak van uw GridView er als volgt uitzien:

<asp:GridView ID="GridView1" runat="server"
    AutoGenerateColumns="False" DataKeyNames="EmployeeID"
    DataSourceID="ObjectDataSource1">
    <Columns>
        <asp:BoundField DataField="LastName" HeaderText="LastName"
          SortExpression="LastName" />
        <asp:BoundField DataField="FirstName" HeaderText="FirstName"
          SortExpression="FirstName" />
        <asp:BoundField DataField="Title" HeaderText="Title"
          SortExpression="Title" />
        <asp:BoundField DataField="HireDate" HeaderText="HireDate"
          SortExpression="HireDate" />
    </Columns>
</asp:GridView>

Neem even de tijd om onze voortgang in een browser weer te geven. Op dit moment ziet u een tabel met een record voor elke werknemer en vier kolommen: één voor de achternaam van de werknemer, een voor hun voornaam, één voor hun titel en één voor de aanhuurdatum.

Afbeelding 3: De LastNamevelden , FirstNameen TitleHireDate velden worden weergegeven voor elke werknemer (klik om de afbeelding op volledige grootte weer te geven)

Stap 2: de voor- en achternamen in één kolom weergeven

Op dit moment worden de voor- en achternamen van elke werknemer weergegeven in een afzonderlijke kolom. Het kan handig zijn om ze in plaats daarvan te combineren in één kolom. Hiervoor moeten we een TemplateField gebruiken. We kunnen een nieuw TemplateField toevoegen, hieraan de benodigde syntaxis voor markeringen en gegevensbinding toevoegen en vervolgens de FirstName en LastName BoundFields verwijderen, of we kunnen het FirstName BoundField converteren naar een TemplateField, het Sjabloonveld bewerken om de LastName waarde op te nemen en vervolgens het LastName BoundField verwijderen.

Beide benaderingen leveren hetzelfde resultaat op, maar persoonlijk vind ik het leuk om BoundFields te converteren naar TemplateFields, omdat de conversie automatisch een ItemTemplate en EditItemTemplate met webbesturingselementen en gegevensbindingsyntaxis toevoegt om het uiterlijk en de functionaliteit van het BoundField na te bootsen. Het voordeel is dat we minder werk moeten doen met het TemplateField, omdat het conversieproces een deel van het werk voor ons heeft uitgevoerd.

Als u een bestaand BoundField wilt omzetten naar een TemplateField, klikt u op de link 'Kolommen bewerken' in de smart tag van de GridView, en het dialoogvenster 'Velden' wordt geopend. Selecteer het BoundField dat u wilt converteren uit de lijst in de linkerbenedenhoek en klik vervolgens op de koppeling Dit veld converteren naar een TemplateField in de rechterbenedenhoek.

Afbeelding 4: Een boundField converteren naar een sjabloonveld vanuit het dialoogvenster Velden (klik om de afbeelding op volledige grootte weer te geven)

Zet het FirstName BoundField om in een TemplateField. Na deze wijziging is er geen waarneembaar verschil in de Designer. Dit komt doordat het converteren van het BoundField naar een TemplateField een TemplateField maakt waarmee het uiterlijk van het BoundField behouden blijft. Ondanks dat er op dit moment geen visueel verschil is in de ontwerpfunctie, heeft dit conversieproces de declaratieve syntaxis van BoundField vervangen - <asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" /> met de volgende TemplateField-syntaxis:

<asp:TemplateField HeaderText="FirstName" SortExpression="FirstName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
            Text='<%# Bind("FirstName") %>'></asp:TextBox>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
            Text='<%# Bind("FirstName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Zoals u kunt zien, bestaat het TemplateField uit twee sjablonen ItemTemplate met een label waarvan Text de eigenschap is ingesteld op de waarde van het FirstName gegevensveld en een EditItemTemplate met een tekstvakbesturingselement waarvan Text de eigenschap ook is ingesteld op het FirstName gegevensveld. De syntaxis van de gegevensbinding - <%# Bind("fieldName") %> geeft aan dat het gegevensveld fieldName is gebonden aan de opgegeven eigenschap webbesturingselement.

Als we de waarde van het LastName gegevensveld willen toevoegen aan dit TemplateField, moeten we een ander Label webcontrole toevoegen in de ItemTemplate en zijn eigenschap Text verbinden met LastName. Dit kan met de hand of via de Designer worden bereikt. Als u dit handmatig wilt doen, voegt u gewoon de juiste declaratieve syntaxis toe aan het ItemTemplatevolgende:

<asp:TemplateField HeaderText="FirstName" SortExpression="FirstName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
            Text='<%# Bind("FirstName") %>'></asp:TextBox>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
            Text='<%# Bind("FirstName") %>'></asp:Label>
        <asp:Label ID="Label2" runat="server"
            Text='<%# Bind("LastName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Als u deze wilt toevoegen via de ontwerpfunctie, klikt u op de koppeling Sjablonen bewerken vanuit de infolabel van GridView. Hiermee wordt de sjabloonbewerkingsinterface van GridView weergegeven. In de slimme tag van deze interface staat een lijst met de sjablonen in de GridView. Omdat we op dit moment slechts één TemplateField hebben, zijn de enige sjablonen die in de vervolgkeuzelijst worden vermeld, die sjablonen voor het TemplateField samen met de FirstNameEmptyDataTemplate en PagerTemplate. De EmptyDataTemplate sjabloon, indien opgegeven, wordt gebruikt om de uitvoer van GridView weer te geven als er geen resultaten zijn in de gegevens die zijn gebonden aan de GridView; de PagerTemplate, indien opgegeven, wordt gebruikt om de paging-interface weer te geven voor een GridView die paging ondersteunt.

Afbeelding 5: De sjablonen van GridView kunnen worden bewerkt via de ontwerpfunctie (klik om de afbeelding op volledige grootte weer te geven)

Om ook het LastName in het FirstName TemplateField weer te geven, sleept u de Label-besturing van de Werkset naar de FirstName van het TemplateField in de ItemTemplate sjabloonbewerkingsinterface van GridView.

Afbeelding 6: Voeg een labelwebbesturingselement toe aan de ItemTemplate van templatefield FirstName (klik hier om de volledige afbeelding weer te geven)

Op dit moment is Text de eigenschap van het labelwebbesturingselement dat is toegevoegd aan templatefield ingesteld op 'Label'. We moeten dit wijzigen zodat deze eigenschap in plaats daarvan is gebonden aan de waarde van het LastName gegevensveld. Klik hiervoor op de smarttag van het label en kies de optie DataBindings bewerken.

Afbeelding 7: Kies de optie DataBindings bewerken in de smart tag van het label (klik om de volledige afbeelding weer te geven)

Hiermee wordt het dialoogvenster DataBindings weergegeven. Hier kunt u de eigenschap selecteren om deel te nemen aan gegevensbinding in de lijst aan de linkerkant en het veld kiezen waarnaar u de gegevens wilt binden in de vervolgkeuzelijst aan de rechterkant. Kies de Text eigenschap aan de linkerkant en het LastName veld aan de rechterkant en klik op OK.

Afbeelding 8: Koppel de Text eigenschap aan het LastName gegevensveld (klik om de afbeelding op volledige grootte weer te geven)

Opmerking

In het dialoogvenster DataBindings kunt u aangeven of gegevensbinding in twee richtingen moet worden uitgevoerd. Als u dit uitgeschakeld laat, wordt de syntaxis <%# Eval("LastName")%> van de gegevensbinding gebruikt in plaats van <%# Bind("LastName")%>. Beide benaderingen zijn prima voor deze zelfstudie. Gegevensbinding in twee richtingen wordt belangrijk bij het invoegen en bewerken van gegevens. Voor het eenvoudig weergeven van gegevens werkt beide benaderingen echter even goed. In toekomstige tutorials bespreken we tweerichtingsgegevensbinding in detail.

Neem even de tijd om deze pagina via een browser weer te geven. Zoals u ziet, bevat de GridView nog steeds vier kolommen; In de FirstName kolom worden echter nu zowel de waarden als het FirstNameLastName gegevensveld weergegeven.

Afbeelding 9: Zowel de als FirstName de LastName waarden worden weergegeven in één kolom (klik om de afbeelding op volledige grootte weer te geven)

Als u deze eerste stap wilt voltooien, verwijdert u het LastName BoundField en wijzigt u de FirstName TemplateField HeaderText-eigenschap in 'Name'. Nadat deze wijzigingen de declaratieve markeringen van GridView hebben gewijzigd, moet dit er als volgt uitzien:

<asp:GridView ID="GridView1" runat="server"
    AutoGenerateColumns="False" DataKeyNames="EmployeeID"
    DataSourceID="ObjectDataSource1">
    <Columns>
        <asp:TemplateField HeaderText="Name" SortExpression="FirstName">
            <EditItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server"
                    Text='<%# Bind("FirstName") %>'></asp:TextBox>
            </EditItemTemplate>
            <ItemTemplate>
                <asp:Label ID="Label1" runat="server"
                    Text='<%# Bind("FirstName") %>'></asp:Label>
                <asp:Label ID="Label2" runat="server"
                    Text='<%# Eval("LastName") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="Title" HeaderText="Title"
            SortExpression="" Title" />
        <asp:BoundField DataField="HireDate" HeaderText="
            HireDate" SortExpression="" HireDate" />
    </Columns>
</asp:GridView>

Afbeelding 10: De voor- en achternamen van elke werknemer worden weergegeven in één kolom (klik om de volledige afbeelding weer te geven)

Stap 3: het agenda-besturingselement gebruiken om hetHiredDateveld weer te geven

Het weergeven van een gegevensveldwaarde als tekst in een GridView is net zo eenvoudig als het gebruik van een BoundField. Voor bepaalde scenario's worden de gegevens echter het beste uitgedrukt met behulp van een bepaald webbeheer in plaats van alleen tekst. Een dergelijke aanpassing van de weergave van gegevens is mogelijk met TemplateFields. In plaats van bijvoorbeeld de huurdatum van de werknemer weer te geven als tekst, kunnen we een agenda weergeven (met behulp van het besturingselement Agenda) met de datum waarop de werknemer is ingehuurd.

Hiervoor moet u eerst het HiredDate BoundField converteren naar een TemplateField. Ga eenvoudig naar de slimme label van GridView en klik op de koppeling 'Kolommen bewerken'. Hierdoor wordt het dialoogvenster 'Velden' geopend. Selecteer het HiredDate BoundField en klik op Dit veld converteren naar een TemplateField.

Afbeelding 11: Het afhankelijke veld converteren HiredDate naar een sjabloonveld (klik om de afbeelding op volledige grootte weer te geven)

Zoals we in stap 2 hebben gezien, vervangt dit het BoundField door een TemplateField dat een ItemTemplate en een EditItemTemplate met een Label en tekstvak bevat, waarvan de eigenschappen van Text zijn gebonden aan de HiredDate-waarde met behulp van de gegevensbindingsyntaxis <%# Bind("HiredDate")%>.

Als u de tekst wilt vervangen door een besturingselement Agenda, bewerkt u de sjabloon door het label te verwijderen en een agendabesturingselement toe te voegen. Selecteer in de Ontwerper de optie Sjablonen bewerken uit de smarttag van GridView en kies het sjabloonveld HireDateItemTemplate in de vervolgkeuzelijst. Verwijder vervolgens het besturingselement Label en sleep een besturingselement Kalender uit de Werkset naar de sjabloonbewerkingsinterface.

Afbeelding 12: Voeg een agendabesturingselement toe aan de HireDate sjabloonvelden ItemTemplate (klik om de afbeelding op volledige grootte weer te geven)

Op dit punt bevat elke rij in GridView een kalenderbesturingselement in het HiredDate sjabloonveld. De werkelijke HiredDate waarde van de werknemer wordt echter nergens in het besturingselement Agenda ingesteld, waardoor elk agenda-besturingselement standaard de huidige maand en datum weergeeft. Om dit te verhelpen, moeten we de eigenschappen HiredDate en VisibleDate van elk werknemer toewijzen aan het besturingselement Calendar.

Kies 'Edit DataBindings' in de smart tag van het besturingselement Kalender. Bind vervolgens zowel de SelectedDate- als de VisibleDate-eigenschappen aan het HiredDate-gegevensveld.

Afbeelding 13: Koppel de SelectedDate en VisibleDate eigenschappen aan het HiredDate gegevensveld (klik om de afbeelding op volledige grootte weer te geven)

Opmerking

De geselecteerde datum van het agenda-besturingselement hoeft niet noodzakelijkerwijs zichtbaar te zijn. Een kalender kan bijvoorbeeld 1^augustus 1999 hebben als de geselecteerde datum, maar de huidige maand en het huidige jaar weergeven. De geselecteerde datum en zichtbare datum worden opgegeven door de SelectedDate en VisibleDate eigenschappen van het besturingselement Agenda. Omdat we zowel de werknemers HiredDate willen selecteren als ervoor willen zorgen dat deze worden weergegeven, moeten we beide eigenschappen aan het HireDate gegevensveld binden.

Wanneer u de pagina in een browser bekijkt, wordt in de kalender nu de maand van de indiensttreding van de werknemer weergegeven en wordt die specifieke datum geselecteerd.

Afbeelding 14: De werknemer HiredDate wordt weergegeven in het agendabesturingselement (klik om de afbeelding op volledige grootte weer te geven)

Opmerking

In tegenstelling tot alle voorbeelden die we tot nu toe hebben gezien, hebben we voor deze zelfstudie geen eigenschap EnableViewState ingesteld False voor deze GridView. De reden voor deze beslissing is dat als u op de datums van het besturingselement Agenda klikt een terugdraaiactie veroorzaakt, waarbij de geselecteerde datum van de agenda wordt ingesteld op de datum waarop u zojuist hebt geklikt. Als de weergavestatus van GridView echter is uitgeschakeld, worden de gegevens van de GridView opnieuw teruggezet naar de onderliggende gegevensbron, waardoor de geselecteerde datum van de agenda wordt teruggezet op de datum van HireDatede werknemer, waarbij de datum wordt overschreven die door de gebruiker is gekozen.

Voor deze zelfstudie is dit een zinloze discussie, aangezien de gebruiker de werknemer HireDate niet kan bijwerken. Het is waarschijnlijk het beste om het besturingselement Agenda te configureren, zodat de datums niet kunnen worden geselecteerd. In deze tutorial wordt getoond dat in sommige gevallen view state moet worden ingeschakeld om specifieke functionaliteiten te bieden.

Stap 4: Het aantal dagen weergeven dat de werknemer heeft gewerkt voor het bedrijf

Tot nu toe hebben we twee toepassingen van TemplateFields gezien:

• Twee of meer gegevensveldwaarden combineren in één kolom en
• Een gegevensveldwaarde uitdrukken met behulp van een webbesturing in plaats van tekst

Een derde gebruik van TemplateFields is het weergeven van metagegevens over de onderliggende gegevens van GridView. Naast het weergeven van de datums van werknemers in dienst, kunnen we bijvoorbeeld ook een kolom hebben waarin wordt weergegeven hoeveel dagen ze aan de baan hebben gewerkt.

Nog een ander gebruik van TemplateFields ontstaat in scenario's waarin de onderliggende gegevens anders moeten worden weergegeven in het webpaginarapport dan in de indeling die in de database is opgeslagen. Stel dat de Employees tabel een Gender veld had dat het teken M heeft opgeslagen of F om het geslacht van de werknemer aan te geven. Bij het weergeven van deze informatie op een webpagina willen we mogelijk het geslacht weergeven als 'Mannelijk' of 'Vrouwelijk', in plaats van alleen 'M' of 'F'.

Beide scenario's kunnen worden verwerkt door een opmaakmethode te maken in de code-behind-klasse van de ASP.NET-pagina (of in een afzonderlijke klassebibliotheek, geïmplementeerd als een Shared methode) die wordt aangeroepen vanuit de sjabloon. Een dergelijke opmaakmethode wordt aangeroepen vanuit de sjabloon met behulp van dezelfde databindingsyntaxis die eerder is gezien. De opmaakmethode kan een willekeurig aantal parameters bevatten, maar moet wel een tekenreeks retourneren. Deze geretourneerde tekenreeks is de HTML die in de sjabloon wordt geïnjecteerd.

Ter illustratie van dit concept gaan we onze zelfstudie uitbreiden om een kolom weer te geven met het totale aantal dagen dat een werknemer aan de taak is geweest. Deze formatteringsmethode neemt een Northwind.EmployeesRow object aan en retourneert het aantal dagen dat de werknemer in dienst is geweest als een tekenreeks. Deze methode kan worden toegevoegd aan de code-behind-klasse van de ASP.NET-pagina, maar moet worden gemarkeerd als Protected of Public om toegankelijk te zijn vanuit de sjabloon.

Protected Function DisplayDaysOnJob(employee As Northwind.EmployeesRow) As String
    ' Make sure HiredDate is not NULL... if so, return "Unknown"
    If employee.IsHireDateNull() Then
        Return "Unknown"
    Else
        ' Returns the number of days between the current
        ' date/time and HireDate
        Dim ts As TimeSpan = DateTime.Now.Subtract(employee.HireDate)
        Return ts.Days.ToString("#,##0")
    End If
End Function

Omdat het HiredDate veld databasewaarden kan bevatten NULL , moeten we er eerst voor zorgen dat de waarde niet NULL is voordat u doorgaat met de berekening. Als de HiredDate waarde is NULL, retourneren we gewoon de tekenreeks 'Onbekend'. Als dit niet NULLhet is, berekenen we het verschil tussen de huidige tijd en de HiredDate waarde en retourneren we het aantal dagen.

Als u deze methode wilt gebruiken, moet u deze aanroepen vanuit een TemplateField in GridView met behulp van de syntaxis van de gegevensbinding. Voeg eerst een nieuw TemplateField toe aan GridView door te klikken op de koppeling Kolommen bewerken in de infolabel van GridView en een nieuw TemplateField toe te voegen.

Afbeelding 15: Een nieuw sjabloonveld toevoegen aan de Rasterweergave (klik om de afbeelding op volledige grootte weer te geven)

Stel de HeaderText-eigenschap van dit nieuwe TemplateField in op 'Days on the Job' en stel de ItemStyle-eigenschap van HorizontalAlign in op Center. Als u de DisplayDaysOnJob methode wilt aanroepen vanuit de sjabloon, voegt u een ItemTemplate en gebruikt u de volgende syntaxis voor gegevensbindingen:

<%# DisplayDaysOnJob(CType(CType(Container.DataItem, DataRowView).Row,
    Northwind.EmployeesRow)) %>

Container.DataItem retourneert een DataRowView object dat overeenkomt met de DataSource record die aan de GridViewRowrecord is gebonden. De Row eigenschap retourneert de sterk getypeerde Northwind.EmployeesRow, die wordt doorgegeven aan de DisplayDaysOnJob-methode. Deze syntaxis voor gegevensbinding kan rechtstreeks worden weergegeven in de ItemTemplate (zoals wordt weergegeven in de declaratieve syntaxis hieronder) of kan worden toegewezen aan de Text eigenschap van een labelwebbesturingselement.

Opmerking

In plaats van een EmployeesRow instantie door te geven aan, kunnen we eenvoudig de HireDate waarde doorgeven met behulp van <%# DisplayDaysOnJob(Eval("HireDate")) %>. De Eval methode retourneert echter een Object, dus we moeten onze DisplayDaysOnJob methodehandtekening wijzigen om een invoerparameter van het type Objectte accepteren. We kunnen de aanroep Eval("HireDate") niet blindelings omzetten naar DateTime omdat de kolom HireDate in de tabel EmployeesNULL waarden kan bevatten. Daarom moeten we een Object als invoerparameter voor de DisplayDaysOnJob methode accepteren, controleren of deze een databasewaarde NULL heeft (die kan worden bereikt met behulp van Convert.IsDBNull(objectToCheck)) en vervolgens dienovereenkomstig doorgaan.

Vanwege deze subtiliteiten heb ik ervoor gekozen om de gehele EmployeesRow instantie door te geven. In de volgende zelfstudie zullen we een beter passend voorbeeld zien voor het gebruik van de Eval("columnName")-syntaxis om een invoerparameter aan een opmaakmethode door te geven.

Hieronder ziet u de declaratieve syntaxis voor onze GridView nadat het TemplateField is toegevoegd en de DisplayDaysOnJob methode die wordt aangeroepen vanuit:ItemTemplate

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
    DataKeyNames="EmployeeID" DataSourceID="ObjectDataSource1">
    <Columns>
        <asp:TemplateField HeaderText="Name"
          SortExpression="FirstName">
            <EditItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server"
                    Text='<%# Bind("FirstName") %>'></asp:TextBox>
            </EditItemTemplate>
            <ItemTemplate>
                <asp:Label ID="Label1" runat="server"
                    Text='<%# Bind("FirstName") %>'></asp:Label>
                <asp:Label ID="Label2" runat="server"
                    Text='<%# Eval("LastName") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="Title" HeaderText="" Title"
            SortExpression="Title" />
        <asp:TemplateField HeaderText="HireDate" SortExpression="
            HireDate">
            <EditItemTemplate>
                <asp:TextBox ID="TextBox2" runat="server"
                    Text='<%# Bind("HireDate") %>'></asp:TextBox>
            </EditItemTemplate>
            <ItemTemplate>
                <asp:Calendar ID="Calendar1" runat="server"
                    SelectedDate='<%# Bind("HireDate") %>'
                    VisibleDate='<%# Eval("HireDate") %>'>
                </asp:Calendar>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Days On The Job">
            <ItemTemplate>
                <%# DisplayDaysOnJob(CType(CType(Container.DataItem, DataRowView).Row,
                    Northwind.EmployeesRow)) %>
            </ItemTemplate>
            <ItemStyle HorizontalAlign="Center" />
        </asp:TemplateField>
    </Columns>
</asp:GridView>

Afbeelding 16 toont de voltooide zelfstudie, wanneer deze wordt bekeken via een browser.

Afbeelding 16: Het aantal dagen dat de werknemer aan de taak is geweest, wordt weergegeven (klik om de afbeelding op volledige grootte weer te geven)

Samenvatting

Het sjabloonveld in het besturingselement GridView biedt een hogere mate van flexibiliteit bij het weergeven van gegevens dan beschikbaar is met de andere veldbesturingselementen. TemplateFields zijn ideaal voor situaties waarin:

• Er moeten meerdere gegevensvelden worden weergegeven in één GridView-kolom
• De gegevens worden het beste uitgedrukt met behulp van een webcontrole in plaats van platte tekst.
• De uitvoer is afhankelijk van de onderliggende gegevens, zoals het weergeven van metagegevens of het opnieuw opmaken van de gegevens

Naast het aanpassen van de weergave van gegevens, worden TemplateFields ook gebruikt voor het aanpassen van de gebruikersinterfaces die worden gebruikt voor het bewerken en invoegen van gegevens, zoals we in toekomstige zelfstudies zullen zien.

De volgende twee zelfstudies gaan verder met het verkennen van sjablonen, te beginnen met het gebruik van TemplateFields in een DetailsView. Hierna gaan we naar de FormView, die gebruikmaakt van sjablonen in plaats van velden om meer flexibiliteit te bieden in de indeling en structuur van de gegevens.

Veel plezier met programmeren!

Over de auteur

Scott Mitchell, auteur van zeven ASP/ASP.NET-boeken en oprichter van 4GuysFromRolla.com, werkt sinds 1998 met Microsoft-webtechnologieën. Scott werkt als onafhankelijk consultant, trainer en schrijver. Zijn laatste boek is Sams Teach Yourself ASP.NET 2.0 in 24 uur. Hij kan worden bereikt op mitchell@4GuysFromRolla.com.

Speciale dank aan

Deze tutorialreeks is beoordeeld door veel behulpzame beoordelers. Hoofdrecensent voor deze handleiding was Dan Jagers. Bent u geïnteresseerd in het bekijken van mijn aanstaande MSDN-artikelen? Zo ja, laat iets van je horen via mitchell@4GuysFromRolla.com.

Vorigevolgende