I have written a .net usercontrol for a gallery which works quite well in my web application if there is a gallery on my page. The problem is when I go to validate my page, using XHTML 1.0 Strict, I get the document type does not allow element "link" here.
I've done a bit of research and it is because I have a stylesheet embedded within the usercontrol, and is called from the body of the masterpage, so it doesn't validate. I can move the stylesheet out of the usercontrol and into the masterfile, but I don't necessary want the stylesheet loading up on every single page. What is the best way to do this - I was hoping to contain the stylesheet within the usercontrol so its simple to 'manage'.
Any advice would be great. Also thinking, do I need to remove the javascript out of the usercontrol as well?
This is the user control in question
<%# Control Language="C#" Debug="true" AutoEventWireup="true" CodeFile="Gallery.ascx.cs" Inherits="Gallery" %>
<%# Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI.WebControls" TagPrefix="asp" %>
<link ID="FancyboxCSS" type="text/css" rel="stylesheet" href="" runat="server" />
<link ID="FancyboxButtonsCSS" type="text/css" rel="stylesheet" href="" runat="server" />
<script type="text/javascript">
$(document).ready(function () {
$(".fancybox").fancybox({
maxWidth: 800,
maxHeight: 800,
fitToView: true,
aspectRatio: true,
openEffect: 'fade',
closeEffect: 'fade',
nextEffect: 'fade',
prevEffect: 'fade',
helpers: {
title: {
type: 'outside'
},
overlay: {
opacity: 0.8,
css: {
'background-color': '#000'
}
},
buttons: {}
}
});
});
<div id="gallery" runat="server">
//images here
</div>
A markup validator processes documents in a markup language, such as HTML or XML, and a document must be complete. For example, an HTML document must minimally contain a title element. And things like <%# should not be included: they are not part of the HTML document but instructions to software that generates HTML.
So you need to submit a complete, generated HTML document, if you wish to validate.
Found the answer here for anyone else looking for the same thing in the future http://msdn.microsoft.com/en-us/library/system.web.ui.htmlcontrols.htmllink(v=vs.80).aspx
// Define an HtmlLink control.
HtmlLink myHtmlLink = new HtmlLink();
myHtmlLink.Href = "~/StyleSheet.css";
myHtmlLink.Attributes.Add("rel", "stylesheet");
myHtmlLink.Attributes.Add("type", "text/css");
// Add the HtmlLink to the Head section of the page.
Page.Header.Controls.Add(myHtmlLink);
Related
i use this code in web forms and worked correctly but in master-page doesn't work
in head of master
<link rel="stylesheet" href="css/FirstPage.css" />
<link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.10.3.custom.css" />
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.10.3.custom.js"></script>
<script type="text/javascript" src="js/slide.js"></script>
<script>
$(document).ready(function () {
$("div[id$='slide']").show('bounce');
$("div[id$='content']").accordion({ fillSpace: true, collapsible: true, active: false });
});
</script>
in body of master
enter code here
but it doesn't work, this code exactly work in web forms but not work in master page why?
Your code is not working because by default web forms page (be it regular page or master page) will add extra prefixes to the controls if they are placed inside other controls which are implementing INamingContainer interface.
If you are sure that you need runat="server" attribute on your divs then you can use inline code and use a ClientID property to get generated identificator:
$(document).ready(function () {
$("#<%=slide.ClientID%>").show('bounce');
$('#<%=content.ClientID%>').accordion({ fillSpace: true, collapsible: true, active: false });
});
Alternatively you can use ClientIDMode enumeration to control how client identificators are selected. In your case use ClientIDMode.Static:
<div runat="server" class="slide" id="slide" ClientIDMode="Static"></div>
I suspect this is because your control ids will be prepended by the ids of the content place holders.
Use the below CSS Selectors to access the controls that ends with id 'slide' and 'content'. Hope that helps..
$("div[id$='slide']")
$("div[id$='content']")
iv added a new folder inside my 'customPages' folder 'Check' i've then added a new webform page inside the 'check' folder called 'show'
<%# Page Language="C#" AutoEventWireup="true" CodeFile="show.aspx.cs" Inherits="DynamicData_CustomPages_Check_show" %>
<!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></title>
</head>
<body>
<form id="form1" runat="server">
<div>
bla bla la
</div>
</form>
</body>
</html>
when I try to navigate it from another page it wont work ERROR: 28889/CRC/Check/show.aspx
The resource cannot be found.
Description: HTTP 404. The resource you are looking for (or one of its dependencies) could have been removed, had its name changed, or is temporarily unavailable. Please review the following URL and make sure that it is spelled correctly.
Requested URL: /CRC/Check/show.aspx
any idea as to why?
EDIT:iv even set it as my start page my right clicking, but it still cant find the page?
You said that you added a WebForm called List, so instead of show.aspx, you should try list.aspx.
If your new folder is in your custompages folder than url shoould be like this
YourApplication/customPages/Check/show.aspx
I think you are missing customPages folder
Open Global.asax
There should be something like this:
routes.Add(new DynamicDataRoute("{table}/{action}.aspx") {
Constraints = new RouteValueDictionary(new { action = "List|Details|Edit|Insert" }),
Model = model
});
Add 'Show' in the action list.
I used this to display the view upon clicking this button, but the partial view doesn't display.
View:
<%=Ajax.ActionLink("See List", "List of Cakes", new AjaxOptions { UpdateTargetId = "theList" })%>
<div id="theList"></div>
I added the unobtrusive script, confirmed it in web.config, what's missing?
Found out from a colleague that I do not need to check something from the web.config as the IDE will automatically add/remove added scripts.
Here are the scripts added:
<script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
I have the following page that references my silverlight application file. This works fine. I was wondering if, instead, I could point to a specific xaml file that is in the .xap file?
Perhaps something like /ClientBin/test.xap?File=SomeXaml.xaml?
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="test.Web.WebForm1" %>
<!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></title>
<script type="text/javascript" src="Silverlight.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div id="silverlightControlHost">
<script type="text/javascript">
Silverlight.createObject(
"ClientBin/test.xap", // source
document.getElementById('silverlightControlHost'), // parent element
"someId", // id for generated object element
{
width: "600px",
height: "600px",
background: "blue",
version: "4.0.60310.0",
autoUpgrade: "true"
},
{ onError: null }, null
);
</script>
</div>
</form>
</body>
</html>
Thanks!
First of all see my answer here to a very similar request that does most of what you need.
All you now need is to get the xaml file name from the query string to the initparams. Your existing code would become:-
Silverlight.createObject(
"ClientBin/test.xap", // source
document.getElementById('silverlightControlHost'), // parent element
"someId", // id for generated object element
{
width: "600px",
height: "600px",
background: "blue",
version: "4.0.60310.0",
autoUpgrade: "true"
},
{ onError: null }, 'StartupPage=<%=Request.QueryString[File]%>'
);
The project I'm working on allows an end-user to modify CSS code to integrate the application as best possible. Most of the CSS values are stored in a database and need to be retrieved and parsed dynamically.
I setup a Style controller, and gave each stylesheet an action, and then passed the configuration data through to the View. I set the ContentType to "text/css" and then generated the stylesheets.
This works fine, but the problem I'm running into is this: none of the code works in the application. I include it in the head code, but it doesn't parse in the code.
An example of what I do is this:
<%# Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" ContentType="text/css" %>
.element {
background-color: <%= ViewData.Model.BackgroundColor %>;
}
I include it like so:
<link href="/style/Basic" rel="stylesheet" type="text/css" media="all" />
When I include the CSS code in a partial view and include it using the ViewModel (wrapped in style tags) in an action, then everything works fine. It is when I try to parse this as a separate file when it does not work.
Is there something I am doing incorrectly? Or is there some kind of glitch?
Thanks in advance :D
Use a tool such as HTTPWatch to verify that the stylesheet is being sent down and not 404'd
Controller
public ActionResult Basic()
{
Response.ContentType = "text/css";
var basicVM = new BasicVM()
{
BackgroundColor = "Lime",
};
return View(basicVM);
}
And the View
<%# Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MvcApplication3.Controllers.BasicVM>" ContentType="text/css" %>
body {
background-color: <%= ViewData.Model.BackgroundColor %>;
}
and the test page
<!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>Test</title>
<link href="/Home/Basic" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
<div>
Test
</div>
</body>
</html>
Turns everything Green