Trying to embed a DataItem within an asp:Image control's ImageUrl property

Question

I have the following Image control within a repeater. I'm trying to get the username to render in between ~/profilepics/ and .jpg but I get the following rendered output

/profilepics/%3C%25#DataBinder.Eval(Container.DataItem,%20%22usernameFrom%22)%20%25%3E.jpg

Here is the markup

<asp:Image ID="Image1" runat="server" ImageUrl='~/profilepics/<%#DataBinder.Eval(Container.DataItem, "username") %>.jpg' />

I have also tried the same but with double quotes and get the same result.

<asp:Image ID="Image1" runat="server" ImageUrl="~/profilepics/<%#DataBinder.Eval(Container.DataItem, "username") %>.jpg" />

Answer 1

It will not work this way. The Image WebControl will not take such markup. The common method is to use ItemDataBound event to assign the image source to each image control within a repeater item.

If you want to use those markups, do not use WebControl, try this:

<img src='<%ResolveClientUrl("~/profilepics")%>/<%#DataBinder.Eval(Container.DataItem, "username") %>.jpg' />

Disclaimer: I did not test the exact code above but the concept should work.

Answer 2

You can't use the databinding syntax inside a server control. Have you tried with a plain img HTML tag instead?

<img src='/profilepics/<%#Eval("username") %>.jpg' />