Make AsyncFileUpload accepts only images files Asp.Net Webforms

Question

I am using asyncfileupload control, I want to accept only images. I used the accept attribute but it didn't work and used OnClientUploadComplete event to catch the content type and stop the uploading on server side, the event didn't fire and caused the OnUploadedComplete to not fire too! And I don't know how to stop it from uploading on the server side. I tried to check the contentType in OnUploadedComplete event, it fires and goes to 'else' but it doesn't show the message that it's supposed to show. Any suggestion?

C# code:

`protected void fileUpload_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
    {
        if (fuImage.HasFile)
        {
            string contentType = fuImage.ContentType;
            if (contentType == "image/jpeg" || contentType == "image/gif"
              || contentType == "image/png")
            {
                string fileName = Path.GetFileName(e.FileName);
                string fileUploadPath = Path.Combine(Server.MapPath("~/images/Resturant"), fileName);
                fuImage.SaveAs(fileUploadPath);

                var url = "~/images/Resturant/" + fileName;
                ScriptManager.RegisterStartupScript(this, this.GetType(), "fileName",
                      "top.$get(\"" + hdfImagePath.ClientID + "\").value = '" + url + "';", true);
            }
            else
            {
            ucMessage1.MessageTitle = "Error Message";
            ucMessage1.MessageDetail = "Please Choose a valid image!";
            ucMessage1.MessageImage = "X";
            ucMessage1.Show();
        }
    }
}`

Design:

<ajaxToolkit:AsyncFileUpload ID="fuImage" runat="server" OnUploadedComplete="fileUpload_UploadedComplete" />

score 0 · Answer 1 · answered Jan 09 '17 at 14:50

0

The UploadedCompleteevent fires on the server side when the file is successfully uploaded which means it cannot check the file extension before it being uploaded.

answered Jan 09 '17 at 14:50

Mahdi

3,199
2
25
35

So, can I roll back the upload in this event? or even change the control background? – Radwa AbdEllah Jan 10 '17 at 07:15
@RadwaAbdEllah I think you can, since you have the file name and the path. So you can check the format server side and if it is not what you want, delete the image (both the file and the db record, if any). – Mahdi Jan 10 '17 at 08:13
Now I want to change the `backColor` of the control to `red` if the file is not in the right format. I wrote that in the if loop but it doesn't change anything, can you help me with that? `fuImage.BackColor = System.Drawing.Color.Red;` – Radwa AbdEllah Jan 10 '17 at 13:55
@RadwaAbdEllah please ask this in a separate question. – Mahdi Jan 10 '17 at 14:10

Make AsyncFileUpload accepts only images files Asp.Net Webforms

1 Answers1