Yakirbu
Yakirbu

Reputation: 182

c# asp.net displaying image in gridview

I wish to display an image in a gridview.

I have a database with 4 columns - id, author, comment, filename (which holds the img path)

http://postimg.org/image/4loz8t9fb/

I have an image upload method so when the user writes his comment, chooses a photo and clicks submit- his name, the comment and the photo path goes to the database (and the photo itself is uploaded to 'Images' folder in the project folder).

<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns = "False"
                   Font-Names = "Arial" Height="375px" Width="498px" DataSourceID="SqlDataSource2" >
                <Columns>

                    <asp:BoundField DataField="Author" HeaderText="Author" SortExpression="Author" />
                    <asp:BoundField DataField="Comment" HeaderText="Comment" SortExpression="Comment" />
                    <asp:BoundField DataField="FileName" HeaderText="FileName" SortExpression="FileName" />
                    <asp:TemplateField HeaderText="Image">

                      <ItemTemplate >

                        <asp:Image ID="Image1" runat="server" ImageUrl ='<%# Eval("FileName") %>' height="120px" Width="150px" />

                      </ItemTemplate>

                    </asp:TemplateField>
                </Columns>
                </asp:GridView>

here is the c# code-

protected void addcomment_Click(object sender, EventArgs e)
    {
        string FileName = "";
        if (fileupload.PostedFile != null)
        {
             FileName = Path.GetFileName(fileupload.PostedFile.FileName);
             //Save files to disk
             fileupload.SaveAs(Server.MapPath("Images/" + FileName));

        }




        if (TextBox1.Text.Length > 0)
        {
            string name = firstName + " " + lastName;
            SqlCommand cmd = new SqlCommand("insert into comments values(@name,@comment,@filename)", conn);
            cmd.Parameters.AddWithValue("@name", name);
            cmd.Parameters.AddWithValue("@comment", TextBox1.Text);
            cmd.Parameters.AddWithValue("@filename", Server.MapPath("Images/" + FileName));
            conn.Open();
            cmd.ExecuteNonQuery();
            GridView1.DataBind();
            conn.Close();
            TextBox1.Text = "";
            Response.Redirect(Request.Url.AbsoluteUri);
        }
        else
        {
            TextBox1.Text = "You have to type something buddy!";
        }

    }

The gridview datasource is the sql of course.

Here is an image of the database and the website

http://postimg.org/image/4loz8t9fb/

Upvotes: 0

Views: 22407

Answers (3)

Kumar
Kumar

Reputation: 41

ImageUrl ='<%# "Images\\"+Eval("FileName") %>'

try this way...

Upvotes: 1

Anoop B.K
Anoop B.K

Reputation: 1478

Dont set full path ,

 string savepath = "~/Images/" + Filename;
cmd.Parameters.AddWithValue("@filename", savepath));

just change this line it will work

and even change

 fileupload.SaveAs(Server.MapPath("~/Images/" + FileName));

Upvotes: 0

Masa
Masa

Reputation: 300

in your design view click on smart tag of your gridview and select 'Edit Columns...' then in the opened window create an ImageField and in it's properties on right side of window, under 'Data' pane set the property 'DataImageUrlField' to the field that contains your urls that in this case is 'FileName'. it should works.

Upvotes: 0

Related Questions