Five common mistakes for ASP.NET (MVC) accesing resources : css,js,images,ajax

To have once for all the link to show to people,because too much makes the same error again and again.

(From here – you can use ResolveUrl or Url.Content – it’s the same for me. I use ResolveUrl because I used first …)

Case 1 The image does not display

Please check you have the following :

<img src='<%= ResolveUrl("~/Content/images/YOURIMAGE.jpg" )%>'  alt="image" style="border:0" />

Case 2 The css does not show

Please check you have the following :

<%= string.Format("<link href='{0}' type='text/css' rel='stylesheet' />",ResolveUrl("~/Content/your.css")) %>

or

<style type="text/css">
@import '<%= ResolveUrl("~/Content/your.css") %>';

</style>

Case 3 The js does not execute (undefined error)

Please check you have the following :

<script type="text/javascript" src='<%= ResolveUrl("~/Scripts/yourjs.js")%>'></script>

Case 4 The js does execute in aspx page,but did not execute under js file

Please check you DO NOT have the following

<%

in the js file. The js file is not interpreted by the same engine as aspx,so can not interpret asp.net tags. Instead,add a parameter to your function : the path.

Simple example : Let’s say in aspx you have :

&lt;script type=”text/javascript”&gt;

function Generate(){

window.open(‘&lt;% Url.Action(“About”)%&gt;’);
}

&lt;/script&gt;

and you call Generate();

When you put in .js file,please put this :

function Generate(url){

window.open(url);
}

and call like this :

Generate('&lt;% Url.Action(“About”)%&gt;');

Case 5 The ajax request gives you a 404 error.

Please ensure that you have

&lt;%= ResolveUrl(&quot;~/path”)%&gt;

and not

/path

Bonus 1: T4MVC,http://mvccontrib.codeplex.com/releases

Bonus 2: Edit the project file and put <MvcBuildViews>true</MvcBuildViews>

( short url: http://bit.ly/asp5Mistakes)


Posted

in

,

by

Comments

8 responses to “Five common mistakes for ASP.NET (MVC) accesing resources : css,js,images,ajax”

  1. GLindqvist Avatar

    Why not use


    …is’t more the ASP.NET MVC way. 🙂

  2. Wil Avatar
    Wil

    Thanks for posting this information. I’ve taken to writing extension methods for javascript, images, css and any other resource used. Then, I can call the extension method like this:

    <link href="” rel=”stylesheet” type=”text/css” />

    Behind the scenes, the CSS method just calls the string.Format and makes the View code less cluttered, but otherwise is the same as your post. Thanks for spreading this around – the path issues can be a real headache.

  3. Wil Avatar
    Wil

    Sorry, I tried to add a bit of code in the comment, but it was removed when the comment was submitted.

    1. Andrei Ignat Avatar
      Andrei Ignat

      Thank you Will.
      Please add without server tags.

  4. Neha Avatar

    I’m impressed, I must say. Really rarely do I encounter a blog that’s both educative and entertaining, and let me tell you, you have hit the nail on the head. Your idea is outstanding; the issue is something that not enough people are speaking intelligently about. I am very happy that I stumbled across this in my search for something relating to this.

  5. Maria Avatar

    Aw, this was a really nice post. In idea I would like to put in writing like this additionally – taking time and actual effort to make a very good article… but what can I say… I procrastinate alot and by no means seem to get something done.

  6. Donna Avatar

    I was very pleased to find this web-site.I wanted to thanks for your time for this wonderful read!! I definitely enjoying every little bit of it and I have you bookmarked to check out new stuff you blog post.

  7. Anas Avatar
    Anas

    thank you
    this was a great blog and it helped me

Leave a Reply

Your email address will not be published. Required fields are marked *