显示数据表格中显示图像(多个图片) - Display Images in gridview (Multiple Images)

- 此内容更新于:2015-12-11
主题:

我实现了一个功能的图像路径存储在数据库和图像存储在服务器上。现在,我想要的是每当图片已经上传,路径应该被保存在表,从那里我要图片gridview所示。我做了一个显示数据表格显示图像,目前它正在在那篇文章里我想显示的路径。同时,请看到显示数据表格的代码:将图片插入到表背后的代码:-请让我知道在Gridview如何显示图像。

原文:

I have implemented a functionality where the Images path gets stored in the database and the Images are stored in the server.

Now, what i want is whenever the images has been uploaded, the path should gets saved in the table and from there I want the images to be shown in the gridview.

I have made a gridview for displaying the Images, currently it is taking the Image_path in that column i want to display Images instead of path.

Also, Please see the code of Gridview:

<asp:GridView ID="grdGalleryData" runat="server" Width="100%" border="1"
              Style="border: 1px solid #E5E5E5;" CellPadding="3" AutoGenerateColumns="False"
              AllowPaging="True" PageSize="2" CssClass="hoverTable" DataKeyNames="Id">
    <AlternatingRowStyle BackColor="#CCCCCC" />
    <Columns>
        <asp:TemplateField HeaderText="Select" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td">
            <ItemTemplate>
                <asp:CheckBox ID="chkDelete" runat="server" />
            </ItemTemplate>
            <HeaderStyle CssClass="k-grid td"></HeaderStyle>
            <ItemStyle Width="30px"></ItemStyle>
        </asp:TemplateField>
        <asp:BoundField DataField="gallery_id" HeaderText="Id" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
        <asp:BoundField DataField="image_title" HeaderText="Gallery title" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
        <asp:BoundField DataField="image_description" HeaderText="Gallery Description" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
        <asp:BoundField DataField="image_path" HeaderText="Images" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
    </Columns>
</asp:GridView>

Code behind for inserting the images into the table:-

protected void btnAdd_Click(object sender, EventArgs e)
{
    if (FileUpload1.HasFile == false)
    {
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", "<script>alert('Please select the file.')</script>", false);
    }
    else
    {
        foreach (var file in FileUpload1.PostedFiles)
        {
            string filename = Path.GetFileName(file.FileName);

            FileUpload1.SaveAs(Server.MapPath("/GalleryImages/" + filename));

            SqlCommand cmd = new SqlCommand("Insert into tbl_gallery_stack(gallery_id, image_title, image_description, image_path) values (@gallery_id,@image_title,@image_description,@image_path)", conn);

            cmd.Parameters.AddWithValue("@gallery_id", ddlImagesId.SelectedValue);
            cmd.Parameters.AddWithValue("@image_title", txtImageTitle.Text);
            cmd.Parameters.AddWithValue("@image_description", txtImageDescription.Text);
            cmd.Parameters.AddWithValue("@image_path", filename);
            conn.Open();
            cmd.ExecuteNonQuery();
            BindGrid();
        }
    }
}

Please let me know how to display Images in the gridview here.

网友:使用图像控制模板字段,而不是绑定字段。

(原文:use image control in template field instead of bound field.)

网友:使用asp:这个msdn.microsoft.com/en-us/library/aa479350.aspximagefield参考

(原文:Use asp:imagefield refer this msdn.microsoft.com/en-us/library/aa479350.aspx)

网友:@???:让我试试..!!

(原文:@صفي: let me try that..!!)

网友:@SainPradeep:不是一个已知的元素

(原文:@SainPradeep: asp:imagefield it is giving not a known element)

网友:我认为你是不写在适当的情况下。这是标签。请按照这个例子

(原文:i think you are not writing in the proper case. this is the tag <asp:ImageField ></asp:ImageField>. Please follow the example)

解决方案:
变化:从纳迪姆:更新。ASPX文件中:背后的代码:
原文:

Change this:

<asp:BoundField DataField="image_path" HeaderText="Images" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />

To this:

<asp:TemplateField HeaderText="Images" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td">
    <ItemTemplate>
        <asp:Image ID="img" runat="server" ImageUrl='<%# Bind("image_path") %>' />
    </ItemTemplate>
</asp:TemplateField>

Update from Nadeem.

In the ASPX file:

<asp:TemplateField HeaderText="Images" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td">
    <ItemTemplate>
        <asp:Image ID="imgDisplay" runat="server" ImageUrl='<%#Getimage(Eval("image_path").ToString()) %>' Width="100px" Height="100px" />
    </ItemTemplate>
</asp:TemplateField>

Code Behind:

protected string Getimage(string img)
{
    if (img != "")
        return ("~/GalleryImages/" + img);
    else
        return ("Images/noimg.gif");
}
网友:为什么它是这样的,在每个负载我不能查看gridview吗?

(原文:why it is like that, on every load i am not able to view the gridview ?)

网友:现在的形象是不来了,我的意思是路径问题

(原文:Now the image is not coming, i mean the path issue)

楼主:@NadeemKhan你看到破碎的形象吗?尝试右键->属性,看看有什么路径。

(原文:@NadeemKhan Do you see a broken image? Try to right-click it -> Properties and see what's the path.)

网友:但在DB的完整路径只是形象的名字

(原文:the full path is D:\Ongoing\CSRProject\CSRProject\CSRProject\GalleryImages\IMG_9865_bkp.jpg but in DB it is just taking the image name)

楼主:你可以'reference路径,必须在您的web项目。

(原文:You can'reference that path, it must be inside your web project.)