Error on adding <script> to master page - asp.net

I have a Master page that have these ContentPlaceHolder:
<asp:ContentPlaceHolder ID="title" runat="server">
</asp:ContentPlaceHolder>
<asp:ContentPlaceHolder ID="contentTitle" runat="server" ></asp:ContentPlaceHolder>
<asp:ContentPlaceHolder ID="content" runat="server">
</asp:ContentPlaceHolder>
when I add these codes for jquery in<head> part of master page:
<script type="text/javascript" src="script/jquery-2.0.1.min.js" />
<link href="script/jquery.contextMenu.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="script/jquery.contextMenu.js" />
and create new aspx file that use that master page ;
<%# Page Title="" Language="C#" MasterPageFile="~/Default.Master" AutoEventWireup="true" CodeBehind="Bed.aspx.cs" Inherits="Zhotel.Lists.Bed" %>
<asp:Content ID="Content1" ContentPlaceHolderID="title" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="contentTitle" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="content" runat="server">
</asp:Content>
when I want to view Design part of file it show me this error:
and when I remove script tags then no more this error occurs.
How can I use script tag that this error not shown?

Add </script> to end of jquery definition, like this:
<script src="script/jquery-2.0.1.min.js" type="text/javascript"></script>
<script src="script/jquery.contextMenu.js" type="text/javascript"></script>

place your scripts outside of contentplaceholder 'title' in head section and make sure that your page has correct reference to your masterpage and also make sure that you are placing the contentplaceholders in their appropriate places

Related

master page implementation in asp.net

i am using vb-2008 to create my application. i created master page in asp but i am not able to use it on other pages. i used :
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" MasterPageFile="~/Mail.Master" Inherits="webform1._Default" %>
i created master page as:
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Mail.master.cs" Inherits="master1.Mail" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
<asp:Image ID="imghead" runat="server" ImageUrl="~/images/images1.jpeg" />
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
but this is not showing master page on other page where it is implemented..
how can i implement the master page..
Now you need to create ASPX pages that have the masterpage assigned and fill up the content placeholders
your new page called, for example, default.aspx will contain:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" MasterPageFile="~/Mail.Master" Inherits="webform1._Default" %>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
<!-- Add code here to add to the HeadContent section -->
</asp:ContentPlaceHolder>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
<!-- Add code here to add to the MainContent section -->
<asp:Image ID="imghead" runat="server" ImageUrl="~/images/images1.jpeg" />
</asp:ContentPlaceHolder>
A MasterPage only holds the PlaceHolders for where other pages will inject content.
There is a hole Video on MasterPages that you can see here:
ASP.NET WebForms Part 5: MasterPages

adding css class in content pages

I am working on a page which is using a Master page for some default design,
I need some css class to be added to the conent page, which we add normally in script tag in normal pages,
My question is how to add some css content in a page which is using Master page,
Thanks,
Vishal.
In your master page you can add a content area within the <head> block. We call ours "HeadContent".
Our master page's head block looks like this:
<head>
...
<asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>
From your content pages you can then include custom scripts/css etc:
<asp:Content runat="server" ID="Head" ContentPlaceHolderID="HeadContent">
<script type="text/javascript" src="<%= Url.Content("~/scripts/gradebook.js") %>"></script>
<style type="text/css">
#import url('<%= Url.Content("~/styles/gradebook.css") %>');
</style>
</asp:Content>
You could add a ConentPlaceHolder in the head area of your masterpage like this:
<head>
....
<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server" />
</head>
In your content page you just need a content control:
<asp:Content ID="Content1" ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="Server">
// Put your css stuff here
</asp:Content>

Inline jquery script to a separate js file with asp.net master pages

Hai guys,
How to include inline jquery scripts used in an aspx to a separate js file with asp.net master pages
Your masterpage can have a script link to the core Jquery file:
<html>
<head runat="server" >
<title>Master page title</title>
//link to Jquery script
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<asp:contentplaceholder id="Head" runat="server" />
</head>
<body>
.
<asp:contentplaceholder id="Main" runat="server" />
.
</body>
ASPX page can have other script links specific to the page only
<% # Page Language="C#" MasterPageFile="~/Master.master" Title="Content Page 1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">
//other scripts specific to this page only
<script type="text/javascript" src="js/jquery.plugin.abc.js"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Main" Runat="Server">
Main content.
</asp:Content>

Links css file to a content page

I have Master page and some content pages.
I want to assign different css file to each of the content pages.
(without using themes)
How can I do that?
I did that once by adding a header-placeholder in the master-page, and explicitly specifying the css in the content-pages.
In the Master:
<head runat="server">
<title></title>
<link href="~/css/common.css" rel="stylesheet" type="text/css" />
<!-- loads of other stuff / -->
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
and in the Content:
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<link href="../css/SomeContent.css" rel="stylesheet" type="text/css" />
<script src="../js/SomeJsToo.js" type="text/javascript"></script>
</asp:Content>
If you're using visual studio 2008, you're going to have a real easy time. First make a master page like this:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
Now make a content page based off of this master page:
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
</asp:Content>
Now in the Content1 placeholder you just place the stylesheet that you would like to have applied to that page.
That's it. Hope this works for you.
Use an external master CSS file for all pages using:
<link rel="stylesheet" type="text/css" href="master.css" />
Then you can use embedded CSS on the individual content pages using the style tag, e.g:
<style type="text/css">
h1 {color:red}
p {color:blue}
</style>
I have tried many of the above ways but still getting error. Finally i use the following codes on the page load and it works fine:
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim css1 As New HtmlLink
css1.Href = ResolveUrl("report.css")
css1.Attributes("rel") = "stylesheet"
css1.Attributes("type") = "text/css"
css1.Attributes("media") = "all"
Me.Page.Header.Controls.Add(css1)
End Sub

Filling in parent master page from child

I'd like to have a page that uses a child master page, fill in a content placeholder of the parent, but I cannot get it to work. Whenever I try I get the error "Cannot find ContentPlaceHolder 'customHead' in the master page '/templates/info.master', verify content control's ContentPlaceHolderID attribute in the content page."
I have a master page (/templates/main.master) defined like this:
<%# Master Language="C#" %>
<head runat="server">
<title>foo</title>
<asp:contentplaceholder runat="server" id="customHead" />
</head>
<body>
<div id="content">
<asp:contentplaceholder runat="server" id="masterContent" />
</div>
Then I have a child master (/templates/info.master) defined like this:
<%# Master Language="C#" MasterPageFile="/templates/main.master" %>
<asp:content id="homeContent" contentPlaceHolderId="masterContent" Runat="server">
<div id="info-container">
<div id="info-content">
<asp:contentplaceholder runat="server" id="infoContent"/>
</div>
</div>
</asp:content>
And finally my page defined like this:
<%# Page Language="C#" MasterPageFile="/templates/info.master" %>
<asp:Content ID="head" ContentPlaceHolderID="customHead" runat="server">
<!-- Custom header area -->
<link rel="stylesheet" type="text/css" href="foo.css"/>
</asp:Content>
<asp:Content ID="content" ContentPlaceHolderID="childContent" runat="server">
This is my child content
</asp:Content>
You didn't define a "customeHead" in your child master page. If you want to expose the root master pages content area, you'll need to expose it in the child master page.
<%# Master Language="C#" MasterPageFile="/templates/main.master" %>
<asp:contentplaceholder runat="server" id="customHead" />
<asp:content id="homeContent" contentPlaceHolderId="masterContent" Runat="server">
<div id="info-container">
<div id="info-content">
<asp:contentplaceholder runat="server" id="infoContent"/>
</div>
</div>
</asp:content>
Are you setting it using this.Page.Master ?

Resources