Header/Footer Block Control Idea, but not Templated Control

J

John Crowley

I keep running into this over and over again...
I want a block server control that renders a header and footer, and child
controls in between.
But I don't want a templated control, for the following reasons:

1) Render blocks are not allowed inside a templated control.
2) I want the inner controls scoped at the parent aspx (or ascx), not at the
template naming container.

This type of control would be ideal for website headers and footers, or
something like a control that simulates a windows tab control with tabs at
the top with a table border around the contents.

For example, for headers and footers, I do this alot:

<%@ Page Inherits="DumbCalculatorPage" %>
<%@ Register TagPrefix="MyStuff" TagName="Header" Src="Header.ascx" %>
<%@ Register TagPrefix="MyStuff" TagName="Footer" Src="Footer.ascx" %>

<html>
<head>
<title>Stupid Dumb Calculator</title>
</head>
<body>
<form runat="server">
<MyStuff:Header runat="server" />
This is a page
Sum: <%= Total %>
<p>
Add This Many: <asp:TextBox id="MyTextBox" runat="server" />
<asp:Button OnClick="DoSomething" Text="Go" runat="server" />
<MyStuff:Footer runat="server" />
</form>
</body>
</html>

Code behind:

public class DumbCalculatorPage : Page {
public int Total {
get {
if(ViewState["Total"] == null) {
ViewState["Total"] = 0;
}
return((int) ViewState["Total"]);
}
set {
ViewState["Total"] = value;
}
}

protected void DoSomething(object sender, EventArgs e) {
Total += int.Parse(MyTextBox.Text);
}

protected TextBox MyTextBox;
}

Now, wouldn't it be great to be able to change that aspx page to this, and
still have it compile and work with the same code behind class:

<%@ Page Inherits="DumbCalculatorPage" %>
<%@ Register TagPrefix="MyStuff" TagName="HeaderFooter"
Src="HeaderFooter.astx" %>

<html>
<head>
<title>Stupid Dumb Calculator</title>
</head>
<body>
<form runat="server">
<MyStuff:HeaderFooter runat="server">
Sum: <%= Total %>
<p>
Add This : <asp:TextBox id="MyTextBox" runat="server" />
<asp:Button OnClick="DoSomething" Text="Go" runat="server" />
</MyStuff:HeaderFooter>
</form>
</body>
</html>

You'll noticed that I've invented a new extension: "astx" T for template (I
can't think of a better name, sorry).
What does an astx look like? very similar to ascx with a couple new tags:

<%@ TemplateControl ... %>

<table>
<tr>
<td>Header top</td>
</tr>
<tr>
<td>
<%@ ParentScope %>
</td>
</tr>
<tr>
<td>Footer row</td>
</tr>
</table>

How would this work? Well the TemplateControl would need two controls
collections, HeaderControls and FooterControls. And two Render methods
RenderHeader and RenderFooter. (The inner controls defined on the page
belong to the parent! It doesn't need to reference them.) During the
render phase of the page, the page would have to call RenderHeader, then
render the inner controls where the ParentScope tag is, then RenderFooter.

Now if you are talking about a static header and footer like my example, it
seems like alot of extra work to change the framework to support this. But
imagine a more complex control, like a tab control that has tabs and that is
rendered as a table around it's contents. Then add properties to the tab
control. Add a property of tab alignment: TabAlignment="Top" versus
TabAlignment="Bottom" or TabAlignment="Right". Then add data binding to the
tab control to determine what tabs to show, and events for clicking on the
tab links. Now the header and footer are very closely tied together, and do
some neat stuff. The idea of this kind of Template becomes much more
interesting.

Implementing this as a templated control we loose our render blocks and
scoping. Why should the page have to search the template control for it's
inner text box? Why can't I use that simple render block?
Implementing this as two separate controls, we loose the connection between
header and footer. It's tough to find out where our td/tr/table mismatches
are between header and footer in different controls. Properties for the
header and footer aren't tied together in any way if they affect the
rendering.

Have I gone insane? Or is this a good idea? Or is there a similar way to
do this already that I am overlooking that does what I want? Is there a
reason this wouldn't work? (Seems the control hierarchy would be a bit odd
:)

I just keep running into this and I want a better solution than the current
template control implementation.
 
J

Justin Dutoit

If your target browsers are uplevel, what about using absolute positioning
instead? Then you can just have everything in the header, including a div
called Footer which is positioned to be at the bottom of the page ...

Justin

John Crowley said:
I keep running into this over and over again...
I want a block server control that renders a header and footer, and child
controls in between.
But I don't want a templated control, for the following reasons:

1) Render blocks are not allowed inside a templated control.
2) I want the inner controls scoped at the parent aspx (or ascx), not at the
template naming container.

This type of control would be ideal for website headers and footers, or
something like a control that simulates a windows tab control with tabs at
the top with a table border around the contents.

For example, for headers and footers, I do this alot:

<%@ Page Inherits="DumbCalculatorPage" %>
<%@ Register TagPrefix="MyStuff" TagName="Header" Src="Header.ascx" %>
<%@ Register TagPrefix="MyStuff" TagName="Footer" Src="Footer.ascx" %>

<html>
<head>
<title>Stupid Dumb Calculator</title>
</head>
<body>
<form runat="server">
<MyStuff:Header runat="server" />
This is a page
Sum: <%= Total %>
<p>
Add This Many: <asp:TextBox id="MyTextBox" runat="server" />
<asp:Button OnClick="DoSomething" Text="Go" runat="server" />
<MyStuff:Footer runat="server" />
</form>
</body>
</html>

Code behind:

public class DumbCalculatorPage : Page {
public int Total {
get {
if(ViewState["Total"] == null) {
ViewState["Total"] = 0;
}
return((int) ViewState["Total"]);
}
set {
ViewState["Total"] = value;
}
}

protected void DoSomething(object sender, EventArgs e) {
Total += int.Parse(MyTextBox.Text);
}

protected TextBox MyTextBox;
}

Now, wouldn't it be great to be able to change that aspx page to this, and
still have it compile and work with the same code behind class:

<%@ Page Inherits="DumbCalculatorPage" %>
<%@ Register TagPrefix="MyStuff" TagName="HeaderFooter"
Src="HeaderFooter.astx" %>

<html>
<head>
<title>Stupid Dumb Calculator</title>
</head>
<body>
<form runat="server">
<MyStuff:HeaderFooter runat="server">
Sum: <%= Total %>
<p>
Add This : <asp:TextBox id="MyTextBox" runat="server" />
<asp:Button OnClick="DoSomething" Text="Go" runat="server" />
</MyStuff:HeaderFooter>
</form>
</body>
</html>

You'll noticed that I've invented a new extension: "astx" T for template (I
can't think of a better name, sorry).
What does an astx look like? very similar to ascx with a couple new tags:

<%@ TemplateControl ... %>

<table>
<tr>
<td>Header top</td>
</tr>
<tr>
<td>
<%@ ParentScope %>
</td>
</tr>
<tr>
<td>Footer row</td>
</tr>
</table>

How would this work? Well the TemplateControl would need two controls
collections, HeaderControls and FooterControls. And two Render methods
RenderHeader and RenderFooter. (The inner controls defined on the page
belong to the parent! It doesn't need to reference them.) During the
render phase of the page, the page would have to call RenderHeader, then
render the inner controls where the ParentScope tag is, then RenderFooter.

Now if you are talking about a static header and footer like my example, it
seems like alot of extra work to change the framework to support this. But
imagine a more complex control, like a tab control that has tabs and that is
rendered as a table around it's contents. Then add properties to the tab
control. Add a property of tab alignment: TabAlignment="Top" versus
TabAlignment="Bottom" or TabAlignment="Right". Then add data binding to the
tab control to determine what tabs to show, and events for clicking on the
tab links. Now the header and footer are very closely tied together, and do
some neat stuff. The idea of this kind of Template becomes much more
interesting.

Implementing this as a templated control we loose our render blocks and
scoping. Why should the page have to search the template control for it's
inner text box? Why can't I use that simple render block?
Implementing this as two separate controls, we loose the connection between
header and footer. It's tough to find out where our td/tr/table mismatches
are between header and footer in different controls. Properties for the
header and footer aren't tied together in any way if they affect the
rendering.

Have I gone insane? Or is this a good idea? Or is there a similar way to
do this already that I am overlooking that does what I want? Is there a
reason this wouldn't work? (Seems the control hierarchy would be a bit odd
:)

I just keep running into this and I want a better solution than the current
template control implementation.
 
G

Guest

So shortly after I wrote this piece of garbage, I noticed that the PlaceHolder control does almost exactly what I want, except it doesn't render anything itself. It seems that a control that renders it's own content wouldn't be that much harder to do

It seems that the PlaceHolder control has a PlaceHolderControlBuilder class in the framework it's using to parse it's content. Anyone have any ideas on how it does what it does? The control builders seem to be less than well documented :)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top