CODEWITHSUNDEEP
asp.netmaster-pages
Rajaram Shelar
Rajaram Shelar

Reputation: 7897

Use script and css files in content pages

For many days I have been trying to figure out a work around to loading javascript and style sheets in my content pages.

How do I link all the resource files like .css and .js in the markup for the master page and then use these directly in the content pages without adding them to each of said content pages?

I found that we can link .css files by using themes and initializing a theme in the master page; But what about .js files and images?

How can they be linked in a master page and then accessed in the content pages?

Please point me in the right direction.

Upvotes: 0

Views: 1374

Answers (2)

Pow-Ian
Pow-Ian

Reputation: 3635

On a master page anything you put in the head will be present for all content pages that use that master.

That is to say if in your master page you have:

<head runat="server">
    <script type="text/javascript" src="/js/pages/jquery.min.js"></script>
    <script type="text/javascript" src="/js/pages/jquery.jscrollpane.min.js"></script>
</head>

then every content page will contain the same thing in the head.

If you had scripts that were used by some pages and not others then on a master page you can define an <asp:content> tag that is in the <head> of the master page.

Then in your content pages you can place links to your javascript files right into the content place holder for the content tag in the page head.

If you wanted to link pictures, I would suggest doing this through javascript. If you created a <script> block in your master page head with something like the following:

var ReusableImageVariable = new Image();
ReusableImageVariable.src = '\A\Path\To\Your\image.jgp';

Then on any content page you could place a script block that would use that ReusableImageVariable and copy it onto the document in a specified place:

<script type='text/javascript'>
    document.getElementById('PlaceHolderForImage').appendChild(ReusableImageVariable);
</script>

Where PlaceHolderforImage is the id of a <div> or other containing element. This would help with browser load times as well because you are loading the images the same time you are loading the style sheets and scripts.

Finally if you wanted to use just ASP, I would define the images as properties of the master page. Then any content page can just access them in code behind and load them where ever you need them.

Upvotes: 1

Brian Mains
Brian Mains

Reputation: 50728

I assume we are talking web forms, not MVC? You can put scripts in the <asp:ScriptManager> control's <Scripts> collection, or <CompositeScript> list. You can get a reference to the ScriptManager via ScriptManager.GetCurrent(PageReference);

Images there isn't anything specifically like this that's built for images; however, it can be built.

Upvotes: 1

Related Questions