Click here to Skip to main content
15,885,985 members
Articles / Web Development / HTML
Article

How to add javascript or stylesheet to header of asp.net page?

Rate me:
Please Sign up or sign in to vote.
4.57/5 (14 votes)
9 Apr 2008CPOL 109.7K   14   14
This article will show you how to dynamically add javascript or stylesheet to the header of asp.net page.

Introduction

Some times you want to dynamically add a javascript to the header of page or even dynamically add a stylesheet to yuor page.

Background

When we are using Page.ClientScript functions, the scripts won't be added to the header it is going to be added to different part of page.

Using the code

The following code shows how you can dynamically add script or stylesheet or any other type of control to the header of page.

VB
'Add the css to header
    Dim hControl As LiteralControl = New LiteralControl
    hControl.Text = "<link href=""default.css"" type=""text/css""
    rel=""stylesheet"" />"
    Me.Page.Header.Controls.Add(hControl)
    'Add javascript for the header
    Dim header As LiteralControl = New LiteralControl
    header.Text = "<script type=""text/javascript""
    src=""EWNHeader.js""></script>"
    Me.Page.Header.Controls.Add(header)

Here is the new version of my code which i got it from comments (nice job Matteo) In the following code you can avoid using literal: To add a meta tag:

HtmlMeta metadescription = new HtmlMeta();
metadescription.Name = "description";
metadescription.Content = "Your page description here";
Page.Header.Controls.Add(metadescription);
To add a stylesheet:
HtmlLink css = new HtmlLink(); 
css.Href = "mystyle.css";
css.Attributes["rel"] = "stylesheet";
css.Attributes["type"] = "text/css";
css.Attributes["media"] = "all";
Page.Header.Controls.Add(css);
To add an external javascript reference:
HtmlGenericControl js = new HtmlGenericControl("script");
js.Attributes["type"] = "text/javascript";
js.Attributes["src"] = "mylibrary.js";
Page.Header.Controls.Add(js);
Thanks again Matteo;)

Points of Interest

As you can see first we define a LiteralControl and then we assign our javascript or stylesheet to the text properties of LiteralControl and then we will add the LiteralControl to header of the page. Now when you run the page, you will see the javascript or stylesheet has been added to the header. you can call put all this code in afunctiona nd call it on the page_load of asp.net page.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior) Innovative Design
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
AnswerPage.ClientScript.RegisterClientScriptInclude can also be used rather than HtmlGenericControl Pin
satishgv198527-Nov-12 2:26
satishgv198527-Nov-12 2:26 
QuestionPage.Header was nothing Pin
Zafarbek Ibrohimov23-Oct-12 23:09
Zafarbek Ibrohimov23-Oct-12 23:09 
I wasn't able to get this to work to start with. Page.Header kept being nothing. Turns out I needed "runat=server" in the head tag.
SuggestionDo something when javascript is loaded Pin
Member 14778521-Jul-11 4:41
Member 14778521-Jul-11 4:41 
QuestionInsert js file BEFORE other javascript code in the head block...? Pin
kupps23-Jun-10 12:41
kupps23-Jun-10 12:41 
AnswerRe: Insert js file BEFORE other javascript code in the head block...? Pin
aaron.barker1-Jan-11 10:39
aaron.barker1-Jan-11 10:39 
AnswerRe: Insert js file BEFORE other javascript code in the head block...? Pin
satishgv198527-Nov-12 2:28
satishgv198527-Nov-12 2:28 
GeneralMaster Pages Pin
Member 30555644-Nov-08 2:09
Member 30555644-Nov-08 2:09 
GeneralRe: Master Pages Pin
John Hutton13-Jan-09 10:21
John Hutton13-Jan-09 10:21 
GeneralAvoid Literal Pin
Matteo Casati9-Apr-08 5:58
Matteo Casati9-Apr-08 5:58 
GeneralRe: Avoid Literal Pin
Armin Kabir9-Apr-08 6:56
Armin Kabir9-Apr-08 6:56 
GeneralRe: Avoid Literal Pin
Matteo Casati9-Apr-08 7:03
Matteo Casati9-Apr-08 7:03 
GeneralRe: Avoid Literal Pin
Armin Kabir9-Apr-08 7:53
Armin Kabir9-Apr-08 7:53 
GeneralRe: Avoid Literal Pin
AndreyMir10-Apr-08 8:07
AndreyMir10-Apr-08 8:07 
GeneralRe: Avoid Literal Pin
Nisha Agrawal11-Aug-09 23:49
Nisha Agrawal11-Aug-09 23:49 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.