Grunderna i master page

Idén med master page är mycket enkel, därför tänker jag inte gå in så mycket på det. Det kommer reda upp sig när ni ser koden.

En master page har filändelsen .master så därför börjar vi med att skapa en sida som heter MasterPage.master i valfritt program.
Koden ser nästan ut som i en vanlig .aspx fil förutom att den inte har @ Page utan @ Master överst på sidan:

Vanlig .aspx sida:

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

Master page:

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

Använder du CodeBehind så lägger du dit "CodeFile="MasterPage.master.cs" som vanligt:

<%@ Master Language="C#" CodeFile="MasterPage.master.cs %>

Så, var det klar nu?
Absolut inte, det är nu det riktiga börjar! Vi börjar med att strukturera en layout till våran master page:

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



<!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 runat="server">

    <title>Min första sida med master page!</title>

</head>

<body>

    <form id="form1" runat="server">

        <div>

            <asp:contentplaceholder id="ContentPlaceHolder1" runat="server" />

        </div>

    </form>

</body>

</html>

Jag tror att ni förstår all kod som är skriven förutom en sak, nämligen detta:

<asp:contentplaceholder id="ContentPlaceHolder1" runat="server" />

Denna kod är mycket enkel, det är den som laddar in datan från din asp:Content.

asp:Content?
För att du ska kunna använda din master page så måste du fixa några saker i din/dina vanliga .aspx filer.
Vi börjar med att visa vilken master page som ska användas på sidan genom att lägga dit MasterPageFile="~/MasterPage.master" i @ Page:

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" %>

Sedan är det bara en sak som ska fixas, nämligan att lägga dit <asp:Content> på sidan:


<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" %>



<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

</asp:Content>

Mellan dessa ska du sedan lägga in allt du vill ha på din sida som du har gjort förut.

Enbart för att testa så lägger vi dit en label:

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" %>



<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <asp:Label ID="Label1" Runat="Server">Denna sida är gjord med master page"</asp:Label>

</asp:Content>

Nu är allt klart! När du sedan laddar upp sidan och kör den så kommer källa koden se ut så här:

<!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="ctl00_Head1"><title>

    Min första sida med master page!

</title></head>

<body>

    <form name="aspnetForm" method="post" action="Default2.aspx" id="aspnetForm">

<div>

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzkzOTQ5NjkyZGSKNndjMB+4A6iLKbtyiv5yBz2Y1A==" />

</div>

        <div>    

    <span id="ctl00_ContentPlaceHolder1_Label1">Denna sida är gjord med master page!</span>

        </div>

    </form>

</body>

</html>

Så, hoppas ni har lärt er hur grunderna i master page fungerar!

Frågor och funderingar lämnas i forumet eller PM.

/ Timmie

Skapades: 2007-09-20 21:47:25
Skribent: Timmie
Lästs 1033 gånger
Betyg: 0 (artikeln har endast 3 röster, det krävs minst 5 för ett betyg)

Kommentarer

Shadi sa den 21 september 2007 kl 08:48:

Mycket bra artikel. Rack Padchi!

Timmie sa den 21 september 2007 kl 11:30:

Tackar, tack för en underbar sida får jag välls säga :)

john94 sa den 16 februari 2008 kl 10:07:

Mycket bra artikel.

Hultin sa den 25 juni 2008 kl 22:07:

Får hålla med, en ruskigt bra artikel :)

henlfern sa den 11 maj 2010 kl 16:21:

Schysst grundartikel, men vad har man egentligen för fördel med att använda sig av master pages?

Timmie sa den 14 maj 2010 kl 16:58:

Du sparar tid genom att inte behöva skapa upp hela sid layouten för varje ny fil du skapar. Blir även betydligt enklare att byta design på en sida.

henlfern sa den 9 juni 2010 kl 16:05:

@Timmie: Jag har pysslat med PHP och klassisk ASP innan och då körde man ju . Jag antar att jag är fast i det tänkandet, att man efterfrågar en sida som i sig blir uppbyggd av en inluderad header, en inkluderad meny, dynamiskt skapad content och avslutningsvis en inkluderad footer. Är det samma sak, fast tvärtom..?

voigtan sa den 9 juni 2010 kl 16:07:

@henlfern, nja, det kan man ju inte direkt säga, jag förstå vad du menar med din jämförelse, men för enkelhetens så kan vi säga att det är som att ha en header+footer include.

henlfern sa den 9 juni 2010 kl 16:43:

@voigtan: Hmmm, hajar fortfarande inte riktigt, men håller på med ett projekt just nu så jag hoppas att jag verkligen hajar det (att det förenklar ändringar av design har jag förstått, men varför det skulle vara så mycket bättre än include håller jag på att försöka greppa).

voigtan sa den 9 juni 2010 kl 16:54:

Läs Microsofts dokumentationer om Master mallar, de är ju inte helt fel och ta upp en hel del matnyttigt: http://msdn.microsoft.com/en-us/library/wtxbf3hh.aspx

Timmie sa den 11 juni 2010 kl 08:44:

@henlfern, den här artikeln är gammal och inte alls den bästa. Tar bara upp grunderna och inte arför man ska använda det. Rekommenderar att du läser dokumentationen som voigtan säger. Master page fungerar som en mall för alla vanliga .aspx filer och ett sätt att slippa köra include som man använde på ASP tiden kort och gott.