fileupload control in editItemTemplate in gridview

See more:

ASP.NET

Gridview

controls

hello all.

I have made a page where image name (ImageName) and image (Image) gets displayed in a gridview.

now when hitting the edit 'Edit' button i should get a textbox to update the ImageName and a fileupload control to update a new Image into database.

ImageEdit.aspx - code

<asp:GridView ID="gvImages" runat="server" AutoGenerateColumns="False"
            DataKeyNames="ImageID" DataSourceID="SqlDataSource1"
            onselectedindexchanged="gvImages_SelectedIndexChanged" Width="500px"
            onrowcommand="gvImages_RowCommand" onrowediting="gvImages_RowEditing"
            onrowupdated="gvImages_RowUpdated">
            <Columns>
                <asp:BoundField DataField="ImageName" HeaderText="ImageName"
                    SortExpression="ImageName" />
                      <asp:TemplateField HeaderText="Image">
                          <EditItemTemplate>
                              <asp:FileUpload ID="fuImage" runat="server" />
                              &nbsp;<asp:Button ID="Button1" runat="server" onclick="Button1_Click"
                                  Text="Upload" />
                          </EditItemTemplate>
                    <ItemTemplate>
                        <asp:Image ID="Image1" runat="server"
                            ImageUrl='<%# "ImageHandler.ashx?ImID="+ Eval("ImageID")  %>' />
                    </ItemTemplate>
                    <ControlStyle Height="100px" Width="100px" />
                </asp:TemplateField>
                <asp:CommandField ShowEditButton="True" />
            </Columns>
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
            ConnectionString="<%$ ConnectionStrings:EmployeeConnectionString %>"
            DeleteCommand="DELETE FROM [ImageTab] WHERE [ImageID] = @ImageID"
            InsertCommand="INSERT INTO [ImageTab] ([ImageName]) VALUES (@ImageName)"
            SelectCommand="SELECT [ImageName], [ImageID] FROM [ImageTab]"
            UpdateCommand="UPDATE [ImageTab] SET [ImageName] = @ImageName WHERE [ImageID] = @ImageID">
            <DeleteParameters>
                <asp:Parameter Name="ImageID" Type="Int32" />
            </DeleteParameters>
            <UpdateParameters>
                <asp:Parameter Name="ImageName" Type="String" />
                <asp:Parameter Name="ImageID" Type="Int32" />
            </UpdateParameters>
            <InsertParameters>
                <asp:Parameter Name="ImageName" Type="String" />
            </InsertParameters>
        </asp:SqlDataSource>

ImageEdit.aspx.cs - code behind

protected void Page_Load(object sender, EventArgs e)
    {
        SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["connectionString"].ConnectionString);
        SqlCommand command = new SqlCommand("SELECT imagename,ImageID from [ImageTab]", connection);
        SqlDataAdapter ada = new SqlDataAdapter(command);
        ada.Fill(dt);
        //gvImages.DataSource = dt;
        gvImages.DataBind();

        
    }

I have also provided a ImageHandler.ashx for displaying the images.

i want to know how can i implement this thing. So that when i hit the Update button, the new name should be updated and the new image gets uploaded in place of old image.