Menu
I've turned Stack Overflow up and down, but, unfortunately, none of the answers helped me.
I have a web app that works perfectly on my local PC using IIS provided by the Visual Studio, but when I deploy this app to the server only the CSS is displayed properly.
Folder structure for files is as follows:
My code, at least for Master page head section looks like this:
<head runat="server">
<link href="CSS/Style.css" rel="stylesheet" />
<script src="/JS/jQuery203Min.js"></script>
<script src="/JS/jQueryUI1103Min.js"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
However, browser generates it like this:
<head>
<link href="../../CSS/Style.css" rel="stylesheet" />
<script src="JS/jQuery203Min.js"></script>
<script src="JS/jQueryUI1103Min.js"></script>
<script src="/JS/HomeArticles.js"></script>
</head>
The problem is that besides CSS neither none of the files in JS folder and none of the files in Media or Uploads folders and subfolder doesn't generate properly.
The thing is if I add "slash" in front of the image src attribute the image gets location http://localhost/Media/Discussion.png and if I don't add "slash" then the image location is http://localhost/Uploads/Users/HrvojeFadiga.jpg when it should be http://localhost/Knowledge%20Management/Uploads/Users/HrvojeFadiga.jpg
Here is a sample of code with images:
<div class="profileInfoWrapper">
<img src="/Uploads/Users/<%=article.User.PhotoLocation %>" />
<span class="postInfo">
<img src="/Media/Rating.png" /><%= GetArticleRating(article.idArticle) %>
</span>
<span class="postInfo">
<img src="/Media/Visitors.png" /><%= GetArticleViews(article.idArticle) %>
</span>
<span class="postInfo">
<img src="/Media/Comments.png" /><%= GetArticleComments(article.idArticle) %>
</span>
</div>
FYI, Global.asax doesn't contain any rules for ignoring file routes except for .axd files which is added by default.
982
I was able to sort this by adding runat=server attribute and using the tilt(~) before defining the source of the file. For example:
<link href="~/CSS/Style.css" rel="stylesheet" runat="server" />
Same applies to javascript files.
119
For any URLs for scripts and styles you need to call ResolveUrl like this:
<link href="<%= ResolveUrl("~/CSS/Style.css") %>" rel="stylesheet" />
Try this. without "~" it can also work but you can add it just to refer the root directory which is always your project solution. So by using Tilde "~" you can properly specify where your css and js files are located.
<link href="~/CSS/styles.css" type="text/css" rel="stylesheet"/>
<script src="~/JS/jScript.js" type="text/javascript"/>
Similarly for your images that you have stored in upload folders. You can access it by using
<img src="~/Uploads/Images/youImage.gif" />
Just try like below and its worked for me...
<script src="JS/jQuery203Min.js" type="text/javascript"></script>
<script src="JS/jQueryUI1103Min.js" type="text/javascript"></script>
<link href="CSS/Style.css" rel="stylesheet" type="text/css"/>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
