Mirza Sahaib
Mirza Sahaib

Reputation: 137

Image is not showing in image control asp.net

Here is my image control in UI:

  <asp:Image ID="Image1" ImageUrl='<%# Bind("strCLogo") %>' runat="server" width="200" Height="200"/>

And here is the C# code, I am grabbing the link of the image from database (customerstbl) but unable to bind it with image control, I can see the image link in the source but its not showing :

 protected void Page_Load(object sender, EventArgs e)
    {
      int nCID = Convert.ToInt32(  Session["nCID"].ToString());

      DataClasses1DataContext _dc = new DataClasses1DataContext();
      CustomersTbl _customer = new CustomersTbl();
      _customer = _dc.CustomersTbls.Where(a => a.nCID == nCID).FirstOrDefault();
     Image1.ImageUrl = _customer.strCLogo.ToString();

    }

here is how I am saving the link of the image in database, It seems I have an issue when I save the image link in database (it saves the whole path not the local directory path and image name)

string s = Server.MapPath("~/Imageslogo/") + Path.GetFileName(LogoUpload.PostedFile.FileName);
            LogoUpload.SaveAs(s);

Upvotes: 0

Views: 3256

Answers (2)

theyetiman
theyetiman

Reputation: 8888

Save the image path as a relative path, configure root path globally

You are storing the path to the image as an absolute path. This is bad for several reasons, the main ones being:

  • What happens if you deploy your app to a different server with a different file structure? your absolute path will be wrong
  • What happens if you decide to move all of your images (but keep the structure of the image folder)? Again, your absolute path will be wrong.

I would advise you to store the relative image path in the database. In this case /Imageslogo/100001203240.jpeg. Then store the image root path (the part before the relative path) in your Web.config file. E.g. in the appSettings:

<appSettings>
    <add key="myApp.Imageroot" value="F:\projects\accounting\Accounting2014\Accounting2014" />
</appSettings>

You can get this appSetting value using the following code:

string myRoot = System.Configuration.ConfigurationManager.AppSettings.Get("myApp.Imageroot");

With these two parts of the full path, you can:

  • Use the relative path in your HTML output which will work fine on your web server
  • Construct the full path by combining the root from your appSettings with the relative path in the database. You might use this is you need to manipulate the image programmatically or otherwise access the actual file instead of just passing the path to the client browser.
  • Easily change the root by changing the appSetting

note

As an aside, if you are setting the ImageUrl property in code behind, then the ImageUrl attribute in your .aspx becomes pointless. So remove it:

<asp:Image ID="Image1" runat="server" width="200" Height="200"/>

Upvotes: 1

ekad
ekad

Reputation: 14614

F:\projects\accounting\Accounting2014\Accounting2014\Imageslogo\10000120324‌​0.jpeg is not the correct value for Image.ImageUrl Property, the correct value is the relative path like ~/Imageslogo/10000120324‌​0.jpeg.

You need to save the relative path to the database, use the code below to get the relative path

string imageLocation = string.Format("~/Imageslogo/{0}", Path.GetFileName(LogoUpload.PostedFile.FileName));

and save imageLocation to strCLogo column of CustomersTbl table.

Upvotes: 1

Related Questions