How to display an image from path in MVC 4?

Question

Before starting, I've seen this asked here before and I've followed the answer and examples given here:

how to display image from path in asp.net mvc 4 and razor view

But when i do

<img src="@Url.Content(Model.ImagePath)" class="dker" alt="..." />

I get an error

Source Error

   [No relevant source lines]
   [NullReferenceException: Object reference not set to an instance of an object.]

In my model:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace NSProfileImages
{
    public class ProfileImages
    {
        public string ImagePath
        {
            get
            {
                return "~/Assets/Images/user_images/avatars/[email protected]";
            }
        }
    }
}

View:

@model NSProfileImages.ProfileImages

<img src="@Url.Content(Model.ImagePath)" class="dker" alt="..." />

If I do

<img src="~/Assets/Images/user_images/avatars/[email protected]" class="dker" alt="..." />

it will display the image normally and no errors.

Do you actually pass an instance of the model to the view in your controller? — GSerg
– GSerg, Commented Jul 23, 2014 at 16:54
Which object is null? How are you providing the model to the view? — David
– David, Commented Jul 23, 2014 at 16:54

User 12345678 · Accepted Answer · 2014-07-23 18:05:26Z

4

I suspect that you forgot to supply an instance of the model to the view.

public ActionResult Index()
{
    // here we instantiate the type and supply it to the view. 
    ViewData.Model = new ProfileImages();
    return View();
}

Alternatively, you could supply the model instance via the View method like so:

 return View(new ProfileImages());

Note that in this case you could very well make the model property static which will remove the need to supply the view model altogether:

public class ProfileImages {
    public static string ImagePath {
        get {
            return "~/Assets/Images/user_images/avatars/[email protected]";
        }
    }
}
...
<img src="@Url.Content(NsProfileImages.ProfileImages.ImagePath)" 
     class="dker" alt="..." />

edited Jul 23, 2014 at 18:05

answered Jul 23, 2014 at 16:53

User 12345678

7,8142 gold badges30 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Johhan Santana Over a year ago

Hi, all the methods you shared did work, thank you. Now what would you recommend is the better way to do this?

User 12345678 Over a year ago

@Johhan It depends really. But generally the first approach will be more flexible. Please consider marking my answer as accepted if it answered your question :)

celerno · Accepted Answer · 2014-07-23 16:55:51Z

0

In your controller you should have something like this:

 ActionResult Index(){
 return View(new ProfileImages());
 }

answered Jul 23, 2014 at 16:55

celerno

1,38512 silver badges31 bronze badges

Comments

eduardobr · Accepted Answer · 2014-07-23 16:56:52Z

0

Maybe you are not passing model to view:

var model = new ProfileImages();
return View(model);

answered Jul 23, 2014 at 16:56

eduardobr

14515 bronze badges

3 Comments

Johhan Santana Over a year ago

that did it, now I'm wondering, do I need to do the same for every view?

eduardobr Over a year ago

No. For posts, the model received will be automatically passed if none is specified.

eduardobr Over a year ago

But in your case, as the field is read-only, the value needs to be in a hiddenfield to kept between posts.

Collectives™ on Stack Overflow

How to display an image from path in MVC 4?

3 Answers 3

2 Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related