locked
Fileup load control in Datalist RRS feed

  • Question

  • User221133681 posted
    Hi,
    How to code-- fileupload control in a datalist for updating images
    Sunday, May 27, 2018 5:26 AM

All replies

  • User-330142929 posted

    Hi Anjitha Kizhakkayil,

    According to your description, I suggest you could use the fileupload control to upload the image to server. and code behind to save the image url to database. I have made a demo, wish it could be useful to you.

    Gif Demo.

    For more details

    aspx.

    <asp:DataList ID="DataList1" runat="server" OnCancelCommand="DataList1_CancelCommand" OnEditCommand="DataList1_EditCommand" OnUpdateCommand="DataList1_UpdateCommand">
                    <HeaderTemplate>
                        <table border="2px">
                            <tr>
                                <th>ID</th>
                                <th>Name</th>
                                <th>Picture</th>
                            </tr>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <tr>
                        <td>
                            <%# Eval("Id") %>
                        </td>
                            <td>
                                <%# Eval("Name") %>
                            </td>
                            <td>
                                <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("ImageUrl") %>'/>
                            </td>
                            <td>
                                <asp:LinkButton ID="lbtEdit" runat="server" CommandName="Edit" CommandArgument='<%# Eval("Name") %>'>Edit</asp:LinkButton>
                            </td>
                            </tr></tr>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <tr>
                            <td>
                                <asp:TextBox ID="Id" runat="server" Text='<%# Eval("Id") %>'></asp:TextBox>
    
                            </td>
                            <td>
                                <asp:TextBox ID="Name" runat="server" Text='<%# Eval("Name") %>'></asp:TextBox>
                            </td>
                            <td>
                                <asp:FileUpload ID="FileUpload1" runat="server" />
                            </td>
                            <td>
                                <asp:LinkButton ID="LinkButton2" runat="server" Text="Update" CommandName="Update" CommandArgument='<%# Eval("Id") %>'></asp:LinkButton>
                                <asp:LinkButton ID="LinkButton1" runat="server" CommandName="Cancel" Text="Cancel"></asp:LinkButton>
                            </td>
                        </tr>
                    </EditItemTemplate>
                    <FooterTemplate>
                        </table>
                    </FooterTemplate>
                </asp:DataList>

    Code Behind.

    protected void Page_Load(object sender, EventArgs e)
            {
                if (!Page.IsPostBack)
                {
                    this.DataList1.DataSource = getDT();
                    this.DataList1.DataBind();
                }
            }
    
            protected void DataList1_CancelCommand(object source, DataListCommandEventArgs e)
            {
                if (e.CommandName=="Cancel")
                {
                    this.DataList1.EditItemIndex = -1;
                    this.DataList1.DataSource = this.getDT();
                    this.DataList1.DataBind();
                }
            }
    
            protected void DataList1_EditCommand(object source, DataListCommandEventArgs e)
            {
                this.DataList1.EditItemIndex = e.Item.ItemIndex;
                this.DataList1.DataSource = this.getDT();
                this.DataList1.DataBind();
            }
    
            protected void DataList1_UpdateCommand(object source, DataListCommandEventArgs e)
            {
                if (e.CommandName=="Update")
                {
                    int id = int.Parse(e.CommandArgument.ToString());
                    string Name = ((TextBox)e.Item.FindControl("Name")).Text;
    
    
                    FileUpload fileupload1 = (FileUpload)e.Item.FindControl("FileUpload1");
                    string virtualFolder = "~/Pictures/";
                    string PhysicalFolder = Server.MapPath(virtualFolder);
                    string filename = Guid.NewGuid().ToString();
                    string extension = Path.GetExtension(fileupload1.FileName);
                    //save in the server folder
                    fileupload1.SaveAs(Path.Combine(PhysicalFolder, filename + extension));
                    //save the url in the database
                    string imageurl = virtualFolder + filename + extension;
    
                    using (SqlConnection conn=new SqlConnection(@"Data Source=(localdb)\MSSQLLocalDB;Initial Catalog=Store;Integrated Security=True;Connect Timeout=30;Encrypt=False;TrustServerCertificate=False;ApplicationIntent=ReadWrite;MultiSubnetFailover=False"))
                    {
                        conn.Open();
                        SqlCommand command = new SqlCommand();
                        command.CommandText = "Update Pics set Name=@Name,ImageUrl=@ImageUrl where Id=@Id";
                        command.Connection = conn;
                        command.Parameters.AddWithValue("@Name", Name);
                        command.Parameters.AddWithValue("@Id", id);
                        command.Parameters.AddWithValue("@ImageUrl", imageurl);
                        command.ExecuteNonQuery();
                    }
                    this.DataList1.EditItemIndex = -1;
                    this.DataList1.DataSource = this.getDT();
                    this.DataList1.DataBind();
                }
    
            }
            private DataTable getDT()
            {
                DataTable dt = new DataTable();
                using (SqlConnection conn=new SqlConnection(@"Data Source=(localdb)\MSSQLLocalDB;Initial Catalog=Store;Integrated Security=True;Connect Timeout=30;Encrypt=False;TrustServerCertificate=False;ApplicationIntent=ReadWrite;MultiSubnetFailover=False"))
                {
                    conn.Open();
                    SqlCommand command = new SqlCommand();
                    command.CommandText = "select * from Pics";
                    command.Connection = conn;
                    SqlDataAdapter sda = new SqlDataAdapter(command);
                    SqlCommandBuilder cb = new SqlCommandBuilder(sda);
                    sda.Fill(dt);
                }
                return dt;
            }

    Table Design.

    CREATE TABLE [dbo].[Pics] (
        [Id]       INT            IDENTITY (1, 1) NOT NULL,
        [Name]     NVARCHAR (50)  NOT NULL,
        [ImageUrl] NVARCHAR (200) NULL,
        PRIMARY KEY CLUSTERED ([Id] ASC)
    );

    Project folder structure

    If the solution could not solve your problem. please feel free to let me know.

    Best Regards,

    Abraham

    Monday, May 28, 2018 3:20 PM