CODEWITHSUNDEEP
asp.netimagerelative-path
mmmbop
mmmbop

Reputation: 181

HTML img and ASP.NET Image and relative paths

What is the correct way to reference an image in ASP.NET for live deployment on IIS?

The following works in dev and production:

<asp:ImageButton ID="ibnEdit" runat="server" OnClick="ibnEdit_Click" ImageUrl="~/App_Themes/Default/images/one.png" Visible="false" ToolTip="Edit" />

The following doesn't work in either: (why not?)

<img src="~/App_Themes/Default/images/two.gif" />

The following works in dev but not in production:

<img src="../App_Themes/Default/images/two.gif" />

Upvotes: 18

Views: 91802

Answers (6)

Naveed Khan
Naveed Khan

Reputation: 374

You can look into my answer . I have resolved the issue using C# language. Why can't I do <img src="C:/localfile.jpg">?

Upvotes: 0

liserdarts
liserdarts

Reputation: 260

The ~ will only work on a server control such as <asp:Image> or <asp:ImageButton>. This tells ASP.Net to insert the application path. Sometime that's just "/" but if your application is not the root directory of the website it will include the path it is in. The img tag is just html and it will not be altered by ASP.Net, so the browser gets the path "~/App_Themes/Default/images/two.gif" and doesn't know how to read it.

I don't know why the last example works in dev but not in production. It might has something to do with having the application in the root directory in dev but in a sub directory in production.

Upvotes: 5

Chris Rosete
Chris Rosete

Reputation: 1258

I use this syntax for access images from master pages

<img src="<%=ResolveUrl("~/Content/Images/error_img.jp")%>" width="350" style="padding-right: 15px; padding-top: 20px;"/>

Upvotes: 6

nikunjM
nikunjM

Reputation: 590

byte[] imageArray = System.IO.File.ReadAllBytes(Server.MapPath("~/Images/Upload_Image.png"));

string base64ImageRepresentation = Convert.ToBase64String(imageArray);

Upvotes: 0

hugo bourret-desmarais
hugo bourret-desmarais

Reputation: 119

This worked for me

$(".selector").attr('src', "Content/themes/base/images/img.png");

The important is that you do not have "/" at the beginning of your new src.

Upvotes: 0

davidsleeps
davidsleeps

Reputation: 9503

If you want to use a regular img tag with the ~ path, you can just add runat="server" into the tag as an attribute (like regular server controls) and the path will be resolved. e.g:

<img src="~/App_Themes/Default/images/two.gif" runat="server" />

For your second part, is the ../ image reference appearing on more than one page, for example a user control or master page (etc) such that you might be using it at different folder levels...

Upvotes: 28

Related Questions