Upload and display Images in SQL database using ASP.Net


Create an .aspx page and write below code:
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">
 <Triggers>
  <asp:PostBackTrigger ControlID="btn_upload" />
 Triggers>
 <ContentTemplate>
  <asp:Label ID="Label1" runat="server">asp:Label><br /><br />
  <asp:FileUpload ID="FU1" runat="server" >asp:FileUpload><br />
  <asp:FileUpload id="FU2" runat="server">asp:FileUpload><br />
  <asp:FileUpload id="FU3" runat="server">asp:FileUpload><br />
  <asp:FileUpload id="FU4" runat="server">asp:FileUpload><br />
  <asp:FileUpload id="FU5" runat="server">asp:FileUpload><br />
 
  <asp:Button ID="btn_upload" runat="server" Text="Upload" OnClick="btn_upload_Click" />
 ContentTemplate>
asp:UpdatePanel>
div>

<div>
<asp:Image ID="img1" runat="server" Height="100" Width="120" /><br />
<asp:Image ID="img2" runat="server" Height="100" Width="120" /><br />
<asp:Image ID="img3" runat="server" Height="100" Width="120" /><br />
<asp:Image ID="img4" runat="server" Height="100" Width="120" /><br />
<asp:Image ID="img5" runat="server" Height="100" Width="120" /><br />
div>

Write below code in .aspx.cs page

On Button click event:

protected void btn_upload_Click(object sender, EventArgs e)
    {
        if (Page.IsValid)
        {
            bool uploadSucess = false;
            for (int fuControl = 1; fuControl <= 5; fuControl++)
            {
                string strFileUpload = "FU" + (fuControl).ToString();   //name of the file uploaded control
                FileUpload FUpload = (FileUpload)Page.FindControl(strFileUpload);
                //check whether file upload control is blank

                if (FUpload.HasFile == true)
                {
                    //save the files
                    FUpload.SaveAs(Server.MapPath("~/ved/Uploads/" + FUpload.FileName));

                    objDAL.ExecuteNonQuery("INSERT INTO Images(ImageName, Image) VALUES ('" + FUpload.FileName + "','" + FUpload.FileName + "')");
                    uploadSucess = true;
                }
            }

            if (uploadSucess == true)
            {
                lblMessage.ForeColor = System.Drawing.Color.Green;
                lblMessage.Text = "file(s) uploaded successfullY !";
            }
            else
            {
                lblMessage.ForeColor = System.Drawing.Color.Red;
                lblMessage.Text = "Error uploading file(s)!";
            }
        }
    }

//to get uploaded images from database

protected void GetImages()
    {
        DataTable dtImges = objDAL.getDataTable("SELECT TOP 5 ImageName FROM Images WHERE ImgId IN (1,2,3,4,5) ");
        int i = 1;
        if (dtImges.Rows.Count > 0)
        {
            foreach (DataRow drImage in dtImges.Rows)
            {
                string imgName = drImage["ImageName"].ToString();

                string strImageControl = "img" + (i).ToString();
                Image img = (Image)Page.FindControl(strImageControl);

                img.ImageUrl = "~/ved/Uploads/" + imgName;
                i++;
            }
        }
    }

You can call the GetImages function when you want to show uploaded images for particualr ImgId either on page load or on button click

Now you need to create one table called Images having three fields

ImgId int identity
ImageName varchar(100)
Image varchar(100)

Comments