Use Razor to display all images in specific folder

Question

How to display list of images from specific folder that contains unique folder name based on the Id passed from model?

For instance, I have two different folders namely "RestaurantA" and "RestaurantB" respectively.

If RestaurantA is clicked, I want to show all the images in folder "RestaurantA", regardless of the image name.

<img src="~/menu/@(Model.Id)/1.jpg" class="materialboxed menu-photo" />

Edit

I forgot to mention that in each folder, the names of the image will be in sequential form. Like in "RestaurantA" folder has 1.jpg, 2.jpg etc. I saw someone posted will have to use for loop in Javascript. Is there any other way other than using Javascript? Perhaps using Razor syntax.

from controller send list of images within that folder and from view, iterate over to produce multiple img tag — Luminous_Dev, Nov 29 '16 at 02:28
`var files = new DirectoryInfo(Path.Combine(%path to your folder%)).GetFiles();` — Luminous_Dev, Nov 29 '16 at 02:30
http://stackoverflow.com/questions/163162/can-you-call-directory-getfiles-with-multiple-filters — Searching, Nov 29 '16 at 03:03

score 2 · Answer 1 · answered Nov 29 '16 at 03:18

You can do this inside razor code at your cshtml file:

@
{
//First get the directory on which your all your images reside
string strDirectory = Server.MapPath(Url.Content("~/*YourPathHere*/"));

//Get all files on the directory and store it on string array
string[] strFiles = Directory.GetFiles(strDirectory);

string strFileName = string.Empty;

//Loop on each file and attach it on img tag
    foreach (var strFile in strFiles)
      {
         strFileName = Path.GetFileName(strFile);
         <img id="myImg" src="@Url.Content("~/*YourPathHere*/" + strFileName)"/>
      }   
}

is it possible to use model data in the image tag ? like this `` bcos I've tried and got error — jenna_3108, Nov 29 '16 at 04:04

Use Razor to display all images in specific folder

1 Answers1