demos/quickstart/protected/pages/Advanced/MasterContent.page


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

<com:TContent ID="body" >

<h1 id="5801">Master and Content</h1>
<p>
Pages in a Web application often share common portions. For example, all pages of this tutorial application share the same header and footer portions. If we repeatedly put header and footer in every page source file, it will be a maintenance headache if in future we want to something in the header or footer. To solve this problem, PRADO introduces the concept of master and content. It is essentially a decorator pattern, with content being decorated by master.
</p>
<p>
Master and content only apply to template controls (controls extending <tt>TTemplateControl</tt> or its child classes). A template control can have at most one master control and one or several contents (each represented by a <tt>TContent</tt> control). Contents will be inserted into the master control at places reserved by <tt>TContentPlaceHolder</tt> controls. And the presentation of the template control is that of the master control with <tt>TContentPlaceHolder</tt> replaced by <tt>TContent</tt>.
</p>
<p>
For example, assume a template control has the following template:
</p>
<com:TTextHighlighter Language="prado" CssClass="source">
&lt;%@ MasterClass="MasterControl" %&gt;
&lt;com:TContent ID="A" &gt;
content A
&lt;/com:TContent &gt;
&lt;com:TContent ID="B" &gt;
content B
&lt;/com:TContent &gt;
&lt;com:TContent ID="B" &gt;
content B
&lt;/com:TContent &gt;
</com:TTextHighlighter>
<p>
which uses <tt>MasterControl</tt> as its master control. The master control has the following template,
</p>
<com:TTextHighlighter Language="prado" CssClass="source">
other stuff
&lt;com:TContentPlaceHolder ID="A" /&gt;
other stuff
&lt;com:TContentPlaceHolder ID="B" /&gt;
other stuff
&lt;com:TContentPlaceHolder ID="C" /&gt;
other stuff
</com:TTextHighlighter>
<p>
Then, the contents are inserted into the master control according to the following diagram, while the resulting parent-child relationship can be shown in the next diagram. Note, the template control discards everything in the template other than the contents, while the master control keeps everything and replaces the content placeholders with the contents according to ID matching.
</p>
<img src=<%~ mastercontent.gif %> alt="Master and Content" />
<img src=<%~ pcrelation.gif %> alt="Parent-child relationship between master and content" />
</com:TContent>