bind image from database to datalist

Question

I am binding image to datalist.

My imagename is in database, i am taking it and wants to bind it to datalist.

I have tried following:

  <asp:DataList ID="dlImages" runat="server">
            <ItemTemplate>
               <asp:ImageButton ID="ImageButton1" Height="200px" Width="200px" 
  ImageUrl='<%# Bind ("PageName","D:\Sagar\Kinston\WebSite\ScreenMasterImages\{0}") %>' runat="server" />
            </ItemTemplate>
        </asp:DataList>

on pageload i have bounded it as:

ds = gc.GetDataToListBinder("select DISTINCT PageOrderID,PageName from ScreenMaster order by PageOrderID")
            dlImages.DataSource = ds.Tables(0)
            dlImages.DataBind()

In above code ds is my dataset and gc.GetDataToListBinder(query) returns dataset.

But images are not getting displayed.

What can be the mistake?

EDIT1:

<asp:ImageButton ID="ImageButton1" Height="200px" Width="200px" ImageUrl='<%#Server.HtmlDecode(Eval("PageName","D:\Sagar\Kinston\WebSite\ScreenMasterImages\{0}.jpg")) %>'  runat="server" />

Hello. When you inspect your html generated element in browser, you can see if at least the name of the image are coming from the database? — Jhonatas Kleinkauff, Jul 18 '13 at 12:30
And what is the path you got? Did you already try: "~/Images/{0}" — Jhonatas Kleinkauff, Jul 18 '13 at 12:38
@JhonatasKleinkauff i just sortedout different things and now my problem remained is, when i fetch the imagename from database and write it to imageurl to give path, if there is space in between the imagename then its adding %20 to it,, Eg. if my imagename is "API path", its showing me D:\Sagar\Kinston\WebSite\ScreenMasterImages\API%20path.jpg — C Sharper, Jul 18 '13 at 12:43

score 1 · Accepted Answer · edited May 23 '17 at 12:05

1

Take a minute and read this:

http://www.codeproject.com/Articles/142013/There-is-something-about-Paths-for-Asp-net-beginne

I think this will help you alot.

EDIT:

For the space problem, take a look:

Why does HttpUtility.UrlEncode(HttpUtility.UrlDecode("%20")) return + instead of %20?

Basically:

ImageUrl='<%# Server.HtmlDecode(Bind("MyImage")) %>'

But i recommend that you store your image name without space in db.

EDIT2:

ImageUrl='<%# Eval("MyImage") %>'

ImageUrl='<%# Server.HtmlDecode(Eval("MyImage")) %>'

edited May 23 '17 at 12:05

Community

1
1

answered Jul 18 '13 at 12:42

Jhonatas Kleinkauff

956
7
18

i just sortedout different things and now my problem remained is, when i fetch the imagename from database and write it to imageurl to give path, if there is space in between the imagename then its adding %20 to it,, Eg. if my imagename is "API path", its showing me D:\Sagar\Kinston\WebSite\ScreenMasterImages\API%20path.jpg – C Sharper Jul 18 '13 at 12:44
It was not giving me error but, now it started giving me error : name bind not declared – C Sharper Jul 18 '13 at 13:05
XML literals and XML properties are not supported in embedded code within ASP.NET – C Sharper Jul 18 '13 at 13:25

score 1 · Answer 2 · answered May 24 '14 at 09:20

<asp:DataList  ID="DataList1" runat="server" RepeatColumns="3" 
                                    RepeatDirection="Horizontal" CellPadding="2" 
                                    CellSpacing="2"
                                    UseAccessibleHeader="True" >
                                    <ItemTemplate>
                                    <asp:ImageButton Width="120" Height="120" ID="Image1" ImageUrl='<%# Eval("Imgpath", "") %>' runat="server" />
        </asp:Datalist>



    .CS

    SqlConnection con;
    SqlCommand cmd;
    string strCon = "Connection String";
    SqlDataAdapter da;

    protected void AlldataImg()
        {
            DataTable dt = new DataTable();
            string strQuery = "select code,imgpath from SA_Stock order by Code";
            cmd = new SqlCommand(strQuery);
            con = new SqlConnection(strCon);
            da = new SqlDataAdapter();
            cmd.CommandType = CommandType.Text;
            cmd.Connection = con;

            try
            {
                con.Open();
                da.SelectCommand = cmd;
                da.Fill(dt);
                DataList1.DataSource = dt;
                DataList1.DataBind();
            }
            catch (Exception ex)
            {
                Response.Write(ex.Message);
            }
            finally
            {
                con.Close();
                da.Dispose();
                con.Dispose();
            }
        }

        protected void Page_Load(object sender, EventArgs e)
        {
                AlldataImg();
    }

    Put Image Path in database too so that image will appear..

score 1 · Answer 3 · answered May 24 '14 at 09:48

protected void DataListPosts_ItemDataBound(object sender, DataListItemEventArgs e)
{
    try
    {
        if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
        {
            DataRowView dr = (DataRowView)e.Item.DataItem;
            Image ImageData = (Image)e.Item.FindControl("ImageData");
            if (dr.Row[4].ToString() != "NA")
            {
                ImageData.Visible = true;
                ImageData.ImageUrl = @"ImgPost/" + dr.Row["ImgPath"].ToString();
            }
            else
                ImageData.Visible = false;


        }
    }
    catch (Exception)
    { }
}

Rahul Choudhary · Answer 4 · 2017-08-07T13:00:03.083

its a old topic but i think it can be usefull for anyone

firstly get your data from string

string sqlget = "select Photo from Promoter";

and get it to database dsget

then do that

dsget.Tables[0].Columns.Add("Photopath", typeof(string));

    for (int i = 0; i < dsget.Tables[0].Rows.Count; i++)
    {
        if (dsget.Tables[0].Rows[i]["Photo"].ToString() != null && dsget.Tables[0].Rows[i]["Photo"].ToString() != "")
        {
            var data = (Byte[])(dsget.Tables[0].Rows[i]["Photo"]);
            var stream = new MemoryStream(data);
            System.IO.BinaryReader br = new System.IO.BinaryReader(stream);
            FileBytes = br.ReadBytes((Int32)stream.Length);
            string base64String = Convert.ToBase64String(FileBytes, 0, FileBytes.Length);
            dsget.Tables[0].Rows[i]["Photopath"] = "data:image/png;base64," + base64String;
        }
    }

    DataList1.DataSource = dsget.Tables[0];
    DataList1.DataBind();

in asp file write the following thing

bind image from database to datalist

4 Answers4