CODEWITHSUNDEEP
javascriptmaster-pages
donde
donde

Reputation: 11

How do I run JavaScript in my ContentPlaceHolder?

I had a load of javascript that ran well when everything was in one page. Now that I've separated it out, I'm not sure how to include the javascript, ssing the HEAD tag in in the master, and also, I had functions that ran when the body loaded but they are in the master too.

By the way this is a .NET 2.0 app.

Upvotes: 1

Views: 13169

Answers (3)

Gregoire
Gregoire

Reputation: 24882

The concept of masterpage is for serverside, your browser will see the result as only one page so you can put your javascript functions on the head section of your master, and call them in your content pages if you want or in the rest of the master page.

EDIT

You can put a content place holder on your head section in your master page, so child page can include its specific script in the head if you want...

Example

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="yourglobaljsfile.js"></script>

    <asp:ContentPlaceHolder ID="ScriptContent" runat="server" />
</head>
<body>
    <div style="position: absolute; width: 100%; top: 0px;">
     <asp:ContentPlaceHolder ID="OtherPlaceholer" runat="server" />
    </div>
    <script type="text/javascript">yourGlobalfunction();</script>
</body>

A child example

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<CatalogViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

    //blabla
     <script type="text/javascript">yourSpecificfunction();</script>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ScriptContent" runat="server">
    <script type="text/javascript" src="yourspecificjsfile.js"></script>
</asp:Content>

Upvotes: 0

KP.
KP.

Reputation: 13720

If you have scripts that are specific to certain pages, and you use one main MasterPage, simply add a ContentPlaceHolder in the head of the master page.

Masterpage: 

<head runat="server">

    <script type="text/javascript" src="my-site-wide-script.js"></script>
    <asp:ContentPlaceHolder ID="cphHead" runat="server" />
</head>

content page:

<asp:content ID="cHead" runat="server" ContentPlaceHolderID="cphHead">
    <script type="text/javascript" src="some-page-specific-script.js"></script>
</asp:content>

End result served to browser (in general):

<head>    
    <script type="text/javascript" src="my-site-wide-script.js"></script>
    <script type="text/javascript" src="some-page-specific-script.js"></script>
</head>

Now any scripts you add to your content page will be after your base scripts. Gives you the flexibility to have page-specific scripts.

And note: VS2005 will throw up a warning/error that ContentPlaceHolder isn't allowed within the head tag. Ignore it, it's a bug in VS. VS2008+ will not bother you about it.

Upvotes: 2

Dave Harding
Dave Harding

Reputation: 1390

Generally, you would put common javascripts that more than one page use into a separate file and link to it from the master page and any one off functions can be included anywhere else by using 

<script type="text/javascript"></script>

Upvotes: 0

Related Questions