0

I am working with ajax AsyncFileUpload control. I have requirement where when user click on fileuploader and select the file from picture and immediately the picture will display on my image control I am using the following method

  protected void fileUploadComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
    {    
string imagepath = Server.MapPath("~/Pics/");
            string serverfilename = Path.GetFileName(AsyncFileUpload1.PostedFile.FileName);
            string fullpath = Path.Combine(imagepath, serverfilename);
            string path = "~/Pics/" + serverfilename;
            //string filename = System.IO.Path.GetFileName(AsyncFileUpload1.FileName);
            //string path = Server.MapPath("~/Pics/") + filename;

            AsyncFileUpload1.SaveAs(fullpath);
            //  FileUpload1.PostedFile.SaveAs(path);
            SqlCommand cmd = new SqlCommand("insert findfriend values('" + path + "','" + TextBox1.Text + "')", con);
            cmd.CommandType = CommandType.Text;
            cmd.ExecuteNonQuery();

            SqlCommand GetImage = new SqlCommand("select * from findfriend where name='" + TextBox1.Text + "'", con);
            GetImage.CommandType = CommandType.Text;
            SqlDataReader dr = GetImage.ExecuteReader();
            dr.Read();
            if (dr.HasRows)
            {



                    Image1.ImageUrl = dr["picture"].ToString();


            }
}

My aspx source

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <script type="text/javascript">
         // This function will execute after file uploaded successfully
         function uploadComplete() {
             document.getElementById('<%=lblMsg.ClientID %>').innerHTML = "File Uploaded Successfully";

         }
         // This function will execute if file upload fails
         function uploadError() {
             document.getElementById('<%=lblMsg.ClientID %>').innerHTML = "File upload Failed.";


                      }

</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <ajax:ToolkitScriptManager ID="scriptManager1" runat="server"/>
        Your Name:&nbsp;&nbsp;&nbsp;
        <asp:TextBox ID="TextBox1" runat="server" Width="223px"></asp:TextBox>
        <br />
        <br />
        Upload Picture:<asp:FileUpload ID="FileUpload1" runat="server" />
        <br />
         <ajax:AsyncFileUpload ID="AsyncFileUpload1" OnClientUploadComplete="uploadComplete" OnClientUploadError="uploadError"
CompleteBackColor="White" Width="350px" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF"
ThrobberID="imgLoad" OnUploadedComplete="fileUploadComplete" />
        <asp:Label ID="lblMsg" runat="server" Text="Label"></asp:Label>
        <br />
        <br />

        <asp:Image ID="Image1" runat="server" Height="295px" Width="338px" />
        <br />
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Upload" />
        &nbsp;<asp:Button ID="Button2" runat="server" onclick="Button2_Click" 
            Text="Button" />
        <br />
        <asp:Label ID="Label1" runat="server"></asp:Label>

    </div>
    </form>
</body>
</html>

Now the problem is this that my picture path is saving into database succesfully image is not binding with image control Experts tell me please where i am wrong

Azad Chouhan
  • 87
  • 4
  • 13

1 Answers1

0

This is because you are trying to access full path i.e. Path from root level like C:/Folder1/Folder2; Which doesn't work in case of Website.

I am assuming Pic folder in Solution folder.

So path have to be something like

  Image1.ImageUrl = @"Pic\logo.jpg";

Pic\logo.jpg" 

is the value coming from your Database

You don't need to use absolute path using ~

Nipun Ambastha
  • 2,553
  • 1
  • 16
  • 26