Introduction
ASP.NET HeadFilter class
The ability to dynamically set the values of various tags that can appear in the HEAD section of a web page is often needed. One of the shortcomings of the ASP.NET model is that the dynamic content must have the "runat=Server" attribute, and tags with this attribute must appear within the server form tag. This makes it a non-trivial task to set these values via code.
This article describes a solution to this problem. The existing solutions that I found either required me to do things that Visual Studio didn�t like, or that I didn�t like. This solution is very simple to set up (can be used with one line of code) and does not interfere with your existing setup at all. You don�t have to change your page inheritance hierarchy, and you don�t have to do things that Visual Studio will complain about either.
To use this in your site, simply add a reference to the DLL (if you've first compiled it), or insert the .vb class file directly into your project, and use the class as needed.
Usage
The most simple usage
In the page Load event, add one line of code:
Response.Filter = _
New HeadFilter(Response.Filter, "<title>My Title Here</title>")
You are simply passing in the exact text that you want to have between the <head> and </head> tags. In this case, a title for the page. If you want to pre-build a huge string that includes not only the title, but CSS links, JavaScript links, META tags, etc., that�s all you have to do.
More granular usage
Of course, you can use the class in a more granular way if you prefer. Here is an example of that usage. Again, in the page Load event, add the following code:
Dim myFilter As New HeadFilter(Response.Filter)
With myFilter
.Title = "My Page Title"
.BaseTarget = "_new"
.AddMetaTag("Author", "", "Travis", "")
End With
Response.Filter = myFilter
So, what�s a filter, anyway?
Basically, ASP.NET gives you a way to look into (and modify) the bytes just before they go to the browser. The Response.Filter class is a Stream object representing the data that is going to the browser. There are many articles online explaining the use of filters for various purposes. The idea is that you can write your own filter, and apply it into the pipeline.
My filter simply looks for the HEAD tags, and puts the text between them, without modifying the rest of the document.
So, what can I put in there?
Just about anything. But the browser (and in some cases the server or the router) is expecting certain things, like the page title, links to style sheets, etc. Here is a summary:
The BASE tag example
<BASE target="_blank">
<BASE href="http:www.mysite.com/somedir/">
These are implemented via the .BaseTarget and .BaseHREF properties.
The STYLE tag example
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
This is implemented via the .Style property.
The TITLE tag example
<title>My Page Title</title>
This is implemented via the .Title property.
The LINK tag example
<link rel=stylesheet type=text/css href=/framework/styles_DEV.css>
This is implemented via the .AddLinkTag method. Add as many as you need.
There are two overloads of this method, and one derived method. This is because the <link> tag has eight attributes, but only three are used most commonly. I gave an overload which only wants the three attributes most often used, and another so that you could use all the eight if need be. If you are using a link tag to add a style sheet, I�ve added a derived method:
.AddStyleSheetReference method - Just pass in the path to the style sheet and it will create an appropriate link tag.
The META tag example
<meta name="Author" content="Travis Laborde">
<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
These are implemented via the .AddMetaTag method. Add as many as you need.
The method lets you pass in both the Name and the HTTP-Equiv attributes. It should be noted that HTML guidelines stipulate that you should only use either the Name or the HTTP-Equiv in any given Meta tag. If you pass in the Name, it will be used, and the HTTP-Equiv will be ignored. Otherwise, HTTP-Equiv will be used.
The SCRIPT tag example
Because the Script tags are a little more complex, no specific property or method has been created to handle them. To insert script tags into your header, use the following general-purpose method instead:
Things to consider
- If you are using other filters on your response stream, some tweaking may be needed to ensure that this doesn't interfere with that.
- The filter currently replaces any text between the
<head> and </head> tags. If you are also using other means to get data there, this will overwrite it. For example, Visual Studio puts a few meta tags in by default, including a page title equal to the form name. This filter replaces those with whatever you create via your code.
