Programmeren in ASP.NET/Master-pagina's

Programmeren in ASP.NET

  1. Wat is ASP.NET?
  2. Wat heb ik nodig voor ASP.NET?
  3. Een ASP.NET-server installeren
  4. Je eerste ASP.NET-pagina
  5. HTML-controls
  6. Foutzoeken
  7. Web-server-controls
  8. Webformulieren
  9. Veelgebruikte objecten
  10. Validering
  11. Master-pagina's
  12. Navigatie
  13. Gegevenstoegang
  14. Werken met databanken
  15. Databankgegevens wijzigen
  16. Werken met datacontrols
  17. GridView
  18. FormView en DetailsView
  19. User-controls
  20. Custom controls
  21. AJAX
  22. Viewstate
  23. Configuratiebestanden
  24. Webservices
  25. Beveiliging
  26. Personalisatie en profielen
  27. Thema's en skins
  28. WebParts
  29. Globalisering
  30. Caching
  31. Mail vanuit ASP.NET
  32. Reguliere expressies
  33. Server-side afbeeldingen
  34. Mobiele toepassingen
  35. Meer informatie
  36. Appendix: foutmeldingen

Een van de zaken die ontbreken in ASP.NET 1.x is de mogelijkheid een sjabloon te definiëren voor meerdere pagina’s. De meeste ontwikkelaars lossen dit op door aan het begin en einde van iedere pagina een (user)control te plaatsen die de algemene opmaak van de pagina verzorgt. ASP.NET 2.0 biedt een veel elegantere oplossing in de vorm van Master-pagina's. Een master-pagina is een paginasjabloon.

In elke pagina kan je instellen welk sjabloon hij gebruikt. Het interessante is dat je ook sjablonen kunt maken op basis van een sjabloon. Zo kun je dus voor delen van een applicatie een enigszins afwijkende opmaak gebruiken, maar toch eventuele wijzigingen aan de algehele opmaak meenemen. Je kunt als het ware een hele hiërarchie van sjablonen maken. Ook kun je tijdens het uitvoeren bepalen welke master-pagina een pagina gebruikt, zodat je bijvoorbeeld gebruikers hun eigen opmaak kunt laten kiezen.

Een master-pagina maken

bewerken

Een master-pagina werkt met zogenaamde ContentPlaceHolder-controls waarmee één of meer regionen in het sjabloon kunnen worden aangegeven. In de pagina plaats je vervolgens Content-controls die aan de hand van de ContentPlaceHolderID aangeven voor welke placeholder ze inhoud bevatten. Hier is een simpel voorbeeld van een master-pagina:

wiki.master

<%@ Master %>
<html >
  <head>
    <title>Master-pagina</title>
  </head>
<body>
  <form runat="server">
    <h1>Master-pagina</h1>
    <hr />
    <asp:contentplaceholder id="Body" runat="server" ></asp:contentplaceholder>
    <hr />
    <asp:contentplaceholder id="Hulpvak" runat="server" ></asp:contentplaceholder>
    <hr />
    &copy 2006 WIKIPEDIA
  </form>
</body>
</html>

De master-pagina ziet eruit als een gewone HTML-pagina, maar wordt bewaard met de extensie .master. Verder bevat ze geen Page-directief, maar wel een Master-directief, en verschillende ContentPlaceHolder-controls.

Alles wat je in de master-pagina zet buiten de contentplaceholders zal terugkomen op elke pagina die de master gebruikt. Je mag eender welke HTML- of ASP.NET- code in de master-pagina opnemen.

Een master-pagina gebruiken

bewerken

Hier is een pagina die de bovenstaande Page Master gebruikt:

content.aspx

<%@ Page Language="VB" MasterPageFile="~/wiki.master" Title="Content pagina" %>

<asp:Content ContentPlaceHolderID="Body" Runat="server">
  <asp:Label ID="lbl1" Runat="server" BackColor="Green">
    Een label in de Body ContentPlaceHolder
  </asp:Label>
</asp:Content>

<asp:Content ContentPlaceHolderID="Hulpvak" Runat="Server">
   Hier kan nog andere tekst verschijnen afhankelijk van de pagina.
</asp:Content>

De master-pagina staat ingesteld in het Page-directief, met behulp van de MasterPageFile-property.

Belangrijk: vergeet nooit de Title-property in te stellen, deze tekst verschijnt binnen de <title>-tag op de pagina.

Merk op dat de pagina content.aspx zelf geen <html>- of <body>-tag meer bevat. Een <script>-sectie kan je zelf altijd toevoegen als er code moet uitgevoerd worden.

De Content-controls bevatten de eigenlijke inhoud van de pagina. Elke Content-control heeft een eigenschap ContentPlaceHolderID, die bepaalt binnen welke ContentPlaceHolder van de master-pagina de inhoud zal verschijnen.

Master-pagina's kunnen ook genest worden, dus de ene master-pagina kan al afgeleid zijn van een andere.

Plaats van de master-pagina

bewerken

Soms staat de master-pagina niet in dezelfde folder als de pagina. Meestal is dit geen probleem.

Als de master-pagina verwijst naar andere bestanden, zoals stylesheets, afbeeldingen, of met hyperlinks bijvoorbeeld, dan moet je opletten, want als de pagina de verwijzing gewoon overneemt, dan klopt ze niet meer.

Bijvoorbeeld:

<head>
  <link rel="stylesheet" href="StyleSheet.css" type="text/css" />
</head>
...
<a href="inhoud.aspx">Inhoud</a>
...
<img alt="Bloem" src="Images/bloem.jpg"/>

Dit voorbeeld werkt goed zolang de pagina in dezelfde folder staat als de master-pagina. In het andere geval kan je twee dingen doen:

  • Gebruik absolute URL's in de master-pagina, bijvoorbeeld
<img src="/mijntoepassing/images/banner.gif" /> 
of
<img src="http://www.mijndomein.com/mijntoepassing/images/banner.gif" />
  • Gebruik applicatie-relatieve URL's in server controls, bijvoorbeeld
<asp:Image ImageUrl="~/images/banner.gif" runat="server" /> 

Ter herinnering: de tilde ~ verwijst naar de applicatie-root. Deze werkt alleen als je runat="server" gebruikt.

Het bovenstaande voorbeeld wordt dan:

<head runat="server">
  <link rel="stylesheet" href="~/StyleSheet.css" type="text/css" runat="server" />
</head>
...
<a id="A1" href="pages/inhoud.aspx" runat="server">Inhoud</a>
...
<asp:Image ID="Image1" AlternateText="Bloem" ImageUrl="~/Images/bloem.jpg" 
runat="server"/>


← Validering Programmeren in ASP.NET Navigatie →
Informatie afkomstig van https://nl.wikibooks.org Wikibooks NL.
Wikibooks NL is onderdeel van de wikimediafoundation.