<link href="CSS/make.css" rel="stylesheet" />
This an external css file for a page named "Default.aspx" which is located in "Root/Pages" directory.
so In "Root/Pages" we will have these:
Default.aspx
CSS/make.css
It will work fine if I launch Default.aspx from current location, But user can change the directory of Default.aspx from main page. Then in Code-Behind I will copy all of Pages contents into another directory.
Just think I will copy Default.aspx and CSS folder from Root/Pages to Root/Backup and try to launch Default.aspx from new location. In this situation it can not read and load external css file!
How can I change css href link dynamically from its container page's location?
For example changing href="CSS/make.css" to href="BackUp/CSS/make.css".
After some research I found that I should use Global and URL Routing, but I did not get any working result.
If you put the css file in the root directory then refer to it using:
<link href="/make.css" rel="stylesheet" />
It should now work even when you move your Default.aspx to another location. The downside to this is that it can clutter your root directory if you plan to use it for multiple different pages with different CSS files.
Let me know if it works and if I am understanding your question right.
function DynamicURL()
{
var URL='CSS/make.css';
var BackUp ='BackUp/';
if (Your condition when it changes directory)
URL = Backup + URL;
document.getElementById('Field').href= URL;
}
Don't forget to set ID to your link href field.
Related
I have one master page, in short there are two images on the master page (a logo at the top, and a fb link at the bottom).
I do however have an admin folder for the .aspx pages for when admin log in.
All non-admin pages need to access these two images with the src of image/logo.jpg and image/fb.jpg. However the admin pages need to access the image with the src of /image/logo.jpg and /image/fb.jpg.
Is it possible to achieve two separate paths depending on the folder, without having to create a second master page?
<img src="/images/yourimage.png" />
use Image Server control instead of html img tag or ResolveUrl method to handle generated url:
<img src='<%= ResolveUrl("~/images/yourimage.png") %>' />
I have created custom DNN module.
And I want to use masonry plugin in it.
So in the module project in VS I have created Scripts folder and put JS files in there.
On the view of ascx file I have added:
<script src="Scripts/jquery.infinitescroll.min.js"></script>
<script src="Scripts/masonry.pkgd.js"></script>
<script src="Scripts/imagesloaded.js"></script>
But when I load the page eith module in console I get:
GET http://dnn7site/resources/shared/scripts/jquery/jquery.min.map 404 (Not Found) Masonry:457
GET http://dnn7site/jquery.min.map 404 (Not Found) Masonry:464
GET http://dnn7site/Demos/Scripts/masonry.pkgd.js 404 (Not Found) Masonry:751
GET http://dnn7site/Demos/Scripts/imagesloaded.js 404 (Not Found) Masonry:752
GET http://dnn7site/Demos/Scripts/jquery.infinitescroll.min.js 404 (Not Found)
What is the way to add and set a relative path to the scripts in DNN?
You should be using the client dependency framework to include scripts in DotNetNuke (feature was added in DNN 6.1+). It will control priority and allow the framework to combine scripts together for a more efficient payload.
The wiki entry for the information is here:
http://www.dnnsoftware.com/wiki/Page/Client-Resource-Management-API
In essence, it's as easy as this:
<%# Register TagPrefix="dnn" Namespace="DotNetNuke.Web.Client.ClientResourceManagement" Assembly="DotNetNuke.Web.Client" %>
<dnn:DnnJsInclude runat="server" FilePath="~/Resources/Shared/Scripts/jquery/jquery.hoverIntent.min.js" />
If you want to do it through code, try this:
RegisterStyleSheet(Page page, string filePath) //default provider and default priority
For scripts or css in my custom module, I usually put the call to ClientResourceManager in my control's PreRender event. I use the ControlPath to get the relative path of my module control to reference the scripts. Example:
protected override void OnPreRender(EventArgs e)
{
ClientResourceManager.RegisterStyleSheet(this.Page, this.ControlPath + "css/view.css");
ClientResourceManager.RegisterScript(this.Page, this.ControlPath + "js/view.js");
}
Try including the full path to the resource files, as per the instructions on the Masonry getting started documentation:
Include the Masonry script in your site.
<script src="/path/to/masonry.pkgd.min.js"></script>
For example:
<script src="/desktopmodules/com.demo.masonry/Scripts/jquery.infinitescroll.min.js"></script>
<script src="/desktopmodules/com.demo.masonry/Scripts/masonry.pkgd.js"></script>
<script src="/desktopmodules/com.demo.masonry/Scripts/imagesloaded.js"></script>
I am trying to bundle jQueryUI in one request.
Global.asax:
var cssjQuery = new StyleBundle("~/Content/BundleCSS/jQuery");
cssjQuery.IncludeDirectory("~/Content/themes/base", "*.css");
Layout:
<link href="#Styles.Url("~/Content/BundleCSS/jQuery")" rel="stylesheet" type="text/css" />
Folder structure:
CSS files: Content/themes/base/*.css
Image files: Content/themes/base/images/*.png
The problem now is that the images can't be loaded, because there is no Folder "BundleCSS":
http://localhost:64648/Content/BundleCSS/images/ui-bg_flat_75_ffffff_40x100.png
How can I solve this issue?
Why don't you simple define your bundle on the theme directory path:
var cssjQuery = new StyleBundle("~/Content/themes/base/jquery-ui-bundle");
cssjQuery.IncludeDirectory("~/Content/themes/base", "*.css");
The relative image paths will still work (as the directory of CSS will remain the same).
Also please remember that the last part (jquery-ui-bundle) is being treated as the file name so it can be whatever you want (as long as it is not the same as one of the files).
I have a JavaScript code which links to survey poll page. When I am embedding the JavaScript code in normal aspx page (without master page), I am getting the survey normally without any issues, but when I am embedding the same code in page which uses master page, I am getting blank page.
This way doesn't work: http://gyazo.com/27f38b5b04897cf0b17747eab05cf746
This way works: http://gyazo.com/c69d3b95afe4a0070cd09834e479a97f
Update
Using <script src='<%=ResolveClientUrl("~/Survey/xlaabsolute.asp?p=1")%>' type="text/javascript" /> renders the poll correctly but the button for voting doesn't do any postback http://gyazo.com/b39fcaa8de3438c8c2a625e3816ba4be.
I can see the content http://gyazo.com/b39fcaa8de3438c8c2a625e3816ba4be
Chances are it's how the script is referenced.
You're using a relative position in your src attribute which could potentially change if it's not in a location that allows Survery/... to be found. Maybe change it to /Survey/... so it always locates the file based on the root path and not where the document currently resides?
You can also make your script tag runat="Server" and reference the script using traditional ASP relative links: src="~/Survey/..." so it resolves correctly.
The way to resolve the issue and make it work regardless of where the control is being used is to use ResolveClientUrl as so:
<script src='<%=ResolveClientUrl("~/Survey/your_script.js")%>' type="text/javascript" />
I am building a web store and I am having a bit of a problem with some of the urls.
I have a large directory of departments and categories in my database that I am using to form my main menu.
The URLs have the form Application/Store/Department/Category
(All store URLs are rewritten to store.aspx?Querystringstuff)
The problem is that some of the urls generated by my code work, but prevent the page's CSS from loading properly.
It is specifically the URLs who's source text contain slashes.
I am URL encoding the source text of course but I'm still having the problem.
My css is linked in a master page-
<link rel="stylesheet" type="text/css" href="~/CSS/Layout.css" runat="server">
Example Links that work -
Ice Machines
http://localhost:1079/ABCWeb/Store/Refrigeration+Equipment/Ice+Machines.aspx
Steam Table Pans
http://localhost:1079/ABCWeb/Store/Catering+%26+Buffet/Steam+Table+Pans.aspx
Example Links that break-
Napkin Holders/Dispensers
http://localhost:1079/ABCWeb/Store/Tabletop/Napkin+Holders%2fDispensers.aspx
Salamanders/Cheesemelters
http://localhost:1079/ABCWeb/Store/Cooking+Equipment/Salamanders%2fCheesemelters.aspx
If it matters here is my code for building URLs-
The array contains an array of items in the path
The first element is not encoded as it contains the the current store path.
private static System.Text.StringBuilder AppendAnchor(this System.Text.StringBuilder str, string[] path)
{
return str.Append("<a href='")
.Append(path.Aggregate((a, b) => a + "/" + HttpUtility.UrlEncode(b)))
.Append(".aspx'><span>")
.Append(HttpUtility.HtmlEncode(path[path.Length-1]))
.Append("</span></a>");
}
Thanks for the help!
Try including your style-sheets using a path relative to the web root. An easy way to do this in ASP .NET webforms is to use ~ on a server-side control eg.
<link rel="Stylesheet" type="text/css" href="~/Css/MyCssFile.css" runat="server" />
ASP.NET should then resolve the correct URL for you, regardless of what the URL is.
Well I looked a little further into it-- The "~" actually seems to be where the problem is occurring.
The links are working correctly but I think the server isn't parsing it correctly when it generates the relative paths...
Here is the css link from the generated code on a working link
../../CSS/Layout.css
Here is the css link on a broken page at the same depth
../../../CSS/Layout.css"
Here is a very ugly fix that works- not sure if there is a better way though
<link rel="stylesheet" type="text/css" href="<%=Request.ApplicationPath+"/Css/Layout.css" %>" />
The strange thing is that the navigation links generated from similar paths in the sitemap are working fine. Maybe it understands the full hierchy better when it is generating paths from the site-map and doesn't try to build a relative path.