ListView and Photos

Question

User456444000 posted

Does anyone know HOW CAN I display image in ListView.

My pictures are jpg type in a folder?

I tried <% #Eval("imag") %> and <%# Container.DataItem %>' but still not working. 

<asp:ListView ID="lVStaffPhotoList" runat="server">

<LayoutTemplate>
<ul class="staffPhoto">
<asp:PlaceHolder runat="server" ID="itemContainer" />
</ul>
</LayoutTemplate>

<ItemTemplate>
<li>
<img src='<%# Container.DataItem %>' />
<br />
'<%# Container.DataItem %>'
</li>
</ItemTemplate>

<EmptyDataTemplate>
<div>
<p>Sorry - No staff photo found!</p>
</div>
</EmptyDataTemplate>

</asp:ListView>

private void ShowStaffPictures()
{

string[] filesindirectory = Directory.GetFiles(Server.MapPath("~/ETS/staffPhoto"));

List<String> images = new List<string>(filesindirectory.Count());

foreach (string item in filesindirectory)
{
images.Add(String.Format("~/ETS/staffPhoto/{0}", System.IO.Path.GetFileName(item)));

}

lVStaffPhotoList.DataSource = images;
lVStaffPhotoList.DataBind();

// RepeaterImages.DataSource = images;
// RepeaterImages.DataBind();


}

Answer 1

User1577371250 posted

Hi,

Create a class with properties and try.

<asp:ListView ID="lVStaffPhotoList" runat="server">

<LayoutTemplate>
<ul class="staffPhoto">
<asp:PlaceHolder runat="server" ID="itemContainer" />
</ul>
</LayoutTemplate>

<ItemTemplate>
<li>
<img src='<%# Eval("ImagePath") %>' runat="server" />
</li>
</ItemTemplate>

<EmptyDataTemplate>
<div>
<p>Sorry - No staff photo found!</p>
</div>
</EmptyDataTemplate>

</asp:ListView>

private void ShowStaffPictures()
{

string[] filesindirectory = Directory.GetFiles(Server.MapPath("~/ETS/staffPhoto"));

List<Photo> images = new List<Photo>;

foreach (string item in filesindirectory)
{
    images.Add(new Photo() { ImagePath = String.Format("~/ETS/staffPhoto/{0}", System.IO.Path.GetFileName(item)) } );

}

lVStaffPhotoList.DataSource = images;
lVStaffPhotoList.DataBind();

}


public class Photo
{

   public string ImagePath { get; set; };

}

Answer 2

User-1716253493 posted

<asp:Image ID="Image1" runat="server" ImageUrl='<%# Container.DataItem.ToString() %>' />

or try add runat="server" to img

<img src='<%# Container.DataItem %>' runat="server" />

Answer 3

User61956409 posted

Hi adilsari,

Thanks for your post.

You could try to store images url in a DataTable then bind ListView with DataTable.

<asp:Image ID="Image1" runat="server" ImageUrl='<%#Eval("imgurl") %>' />

DataTable tb = new DataTable();
tb.Columns.Add("imgurl");

foreach (string item in filesindirectory)
{
    string ImagePath = String.Format("~/ETS/staffPhoto/{0}", System.IO.Path.GetFileName(item));
    tb.Rows.Add(ImagePath);

}

lVStaffPhotoList.DataSource = tb;
lVStaffPhotoList.DataBind();

Best Regards,

Fei Han

Answer 4

User-330204900 posted

Hi adilsari, you have posted in the Dynamic Data forum is your post regarding Dynamic Data or just general ListView?