The Head Tag in ASP.NET 2.0

Monday, March 26, 2007

The Themes feature in ASP.NET 2.0 requires a server-side <head> tag. In other words, if you don't have runat="server" in the <head> tag, like the following:

<head runat="server">
    <!-- head stuff -->
</head>

 

… then trying to use css files from a theme will create a runtime exception with a clear error message:

Exception Details: System.InvalidOperationException: Using themed css files requires a header control on the page. (e.g. <head runat="server" />).

Not every component yields such a direct message, however.

I've been updating pages in a 5 year old application by adding some AJAX features and using some flair from the Control Toolkit. It's been some time since I've been in the UI layer of an application, but I've restrained myself and haven't gotten too crazy. Still, when I saw the Calendar extender I knew it was a perfect fit. After adding the control, the page threw an exception.

System.NullReferenceException: Object reference not set to an instance of an object.
at AjaxControlToolkit.ScriptObjectBuilder.RegisterCssReferences(Control control) ...
at AjaxControlToolkit.ExtenderControlBase.OnPreRender(EventArgs e) ...
at System.Web.UI.Control.PreRenderRecursiveInternal() ...
...

Because I knew that the themes feature in ASP.NET 2.0 relies on an active header control to inject style sheets, I figured the ScriptObjectBuilder used the same trick to inject new script tags. Just adding runat="server" in the head tag of the page was enough to fix the problem.


Comments
John Taylor Tuesday, April 10, 2007
Cheers!

This solved a similar problem I was having...but for me the head block was missing [ajaxing an existing page], the error I was getting was:
System.NullReferenceException was unhandled by user code
Message="Object reference not set to an instance of an object."
Source="AjaxControlToolkit"
StackTrace:
at AjaxControlToolkit.ScriptObjectBuilder.RegisterCssReferences(Control control) in d:\E\AjaxControlToolkit\Release\AjaxControlToolkit\ExtenderBase\ScriptObjectBuilder.cs:line 229
at AjaxControlToolkit.ExtenderControlBase.OnPreRender(EventArgs e) in d:\E\AjaxControlToolkit\Release\AjaxControlToolkit\ExtenderBase\ExtenderControlBase.cs:line 398
at System.Web.UI.Control.PreRenderRecursiveInternal()
at System.Web.UI.Control.PreRenderRecursiveInternal()
at System.Web.UI.Control.PreRenderRecursiveInternal()
at System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint)
Avi Baymesh Friday, April 13, 2007
This also solved a problem for me using the tool kit. Awesome.
gravatar mansi trivedi Tuesday, April 6, 2010
Thanks a lot. My problem is solved. Had the same problem.
Kirill Wednesday, September 1, 2010
Thank you very much! I had similar issue today with on of my scripts (found in EventLoger):

...
Exception information:
Exception type: InvalidOperationException
Exception message: Using themed css files requires a header control on the page. (e.g. <head runat="server" />).
...

Will try to to use your advice tomorrow.
gravatar Giorgio Tuesday, November 2, 2010
Another way is to set in the Page directive EnableTheming="false" StylesheetTheme="" Theme="".
Comments are now closed.
by K. Scott Allen K.Scott Allen
My Pluralsight Courses
The Podcast!