Bind Image In GridView Using C# With ASP.NET

In a case of using image uploading and downloading from the database, the following sample will help you.

In cases of using image uploading and downloading from the database, the following sample will help you.

Download the sample and change the connection string, and then it will work.

If you want to really have a data-bound GridViewImageColumn, the column in the database should contain the actual images. Since, the column in your database contains only the paths to the images: 

1. ADD
2. UPLOAD
3. VIEW 
4. REMOVE CATEGORY

Description

BIND THE IMAGE IN GRIDVIEW

This application is developed to Bind and view the images in the grid along with their details. Here, we can add the category name which specifies under which image the details will be bound. In upload category, Specify the name and description, Select the category under which you wish to upload the Image; choose the file path and bind. Further, view the image with its name and category in View category. Remove category will delete the entire category.

<asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333"
              AutoGenerateColumns="false" >
           <AlternatingRowStyle BackColor="White" />
           <Columns>
               <asp:TemplateField HeaderText="Image Name">

                   <ItemTemplate>
                       <asp:Label ID="Label1" runat="server" Text='<%#Eval("ImgName")%>'></asp:Label>
                   </ItemTemplate>
               </asp:TemplateField>
               <asp:TemplateField HeaderText="Image Description" >

                   <ItemTemplate>
                       <asp:Label ID="Label2" runat="server" Text='<%#Eval("ImgDesc")%>' Width="200"></asp:Label>
                   </ItemTemplate>
               </asp:TemplateField>
               <asp:TemplateField HeaderText="Image">

                   <ItemTemplate>
                       <asp:Image ID="Image1" runat="server" Width="150" Height="100" ImageUrl='<%#Eval("ImgPath")%>'/>
                       <asp:Label ID="Label3" runat="server"></asp:Label>
                   </ItemTemplate>
               </asp:TemplateField>
           </Columns>
           <EditRowStyle BackColor="#2461BF" />
           <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
           <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
           <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
           <RowStyle BackColor="#EFF3FB" />
           <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
           <SortedAscendingCellStyle BackColor="#F5F7FB" />
           <SortedAscendingHeaderStyle BackColor="#6D95E1" />
           <SortedDescendingCellStyle BackColor="#E9EBEF" />
           <SortedDescendingHeaderStyle BackColor="#4870BE" />
    </asp:GridView>

• bindCategory.sql
• BindImage.sql