Images not showing when foreach loop working in _PartialView Page

Question

I have a model class like following

public class UserViewModel
{
    public UserViewModel() 
    {
        UsersDet = new Dictionary<long, string>(); 
        usrdat  = new List<User>();    
    }

    public Dictionary<long , string> UsersDet { get; set; }
    public IEnumerable<User> usrdata { get; set; }
}

Then I'm trying to get those model values in partial view like following

this partial view is a popup actually.

_UserView partial view

@model Project.ViewModels.UserViewModel

<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-body" style="width: 530px;">
            <div id="slider_view" style="display: block;">
                <div class="flexslider">
                    <ul class="slides">
                        @foreach (var item in Model.UsersDet )
                        {         
                            <li data-thumb="~/Upload_Images/A.jpg">
                                <img src="~/Upload_Images/A.jpg" data-imagedata="image001" />
                                <p class="flex-caption">Title</p>
                            </li>
                        }
                    </ul>
                </div>
            </div>
       </div>
    </div>
</div>

Here I cannot see the A.jpg images in Popup, but when I use like following I can see images

_UserView partial view

@model Project.ViewModels.UserViewModel

<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-body" style="width: 530px;">
            <div id="slider_view" style="display: block;">
                <div class="flexslider">
                    <ul class="slides">
                        @for (int i =0; i < 3 ; i ++)
                        {         
                            <li data-thumb="~/Upload_Images/A.jpg">
                                <img src="~/Upload_Images/A.jpg" data-imagedata="image001" />
                                <p class="flex-caption">Title</p>
                            </li>
                        }
                    </ul>
                </div>
            </div>
       </div>
    </div>
</div>

this is controller method to bind values to above popup

    [HttpGet]
    public PartialViewResult MethodName(int id)
    {
        try
        {    

            IEnumerable<User> listofData = ..
            UserViewModel listofimage = new UserViewModel();


            if (listofData != null) 
            {
                listofimage.usrdata = listofData;

                foreach(var item in listofimage.usrdata)
                {
                    var path = RenderImage(item.ImageValue, "UploadImagePath");                        

                    var fileResult = path as FilePathResult;

                    if (fileResult != null)
                    {

                        string imageurl = fileResult.FileName;

                        imageurl = imageurl.Replace(@"\\", @"\");

                        listofimage.UsersDet.Add(item.CaseID, imageurl);
                    }                        
                }
            }                

            return PartialView("_UserView", listofimages);   

        }
        catch (Exception)
        {
            throw;
        }

    } 

    public ActionResult RenderImage(string imageid, string pathvalue)
    {
        try
        {
            var URL = System.Configuration.ConfigurationManager.AppSettings[pathvalue].ToString();
            var path = Path.Combine(URL, imageid + ".jpg");
            return base.File(path, "image/jpeg");
        }
        catch (Exception)
        {
            throw;
        }
    }

Whats is wrong in my foreach approach how to populate elements as loop

Answer 1

If Model.UsersDet is populated with items then < li > elements will be rendered. If they are rendered but you don't see the images then you open the devtools and in the Network tab you look for the requests made for each image. If there requests have bad response then you fixed it according to the returned http status.

But not having the project to debug and if you are saying that @for is working but @foreach is not then the problem should be that the Model.UsersDet is empty.