Upload and save file in Folder (Dictionary) using jQuery Uploadify Plugin in ASP.Net

Last Reply 5 months ago By pandeyism

Posted 5 months ago

This question is from this link

How to send email with Multiple Attachments in ASP.Net Website

1. When I click attack, depending on what PC I use, the selected file gets displayed or I get IO error.

What could be causing this?

The Uploads folder has permissions already.

2. When the selected file goes get displayed, it does not store the selected files into the Uploads folder.

3, When I click the [x] to remove a file, it does not remove the file.

when I click the attach files button, I get IO Error.

http://debestqualityprivatehomecare.com/ioeror.png


Posted 5 months ago

Thank you very much Pandeyism,

Hope I am not being too much of a burden but what about the other two issues?

1, The attachment is working but the images are not getting stored in the Uploads folder.

I suspect that when you click to attach files, when the attached file is displayed on the screen, it means that it has been stored to the Uploads folder, no?

2, And when you click the [x] to remove a file, it doesn't remove the file.

Is it because the file is not stored to the Uploads folder?

Many thanks for your patience and assistance.


Posted 5 months ago

Hi simflex,

Refer below sample.

HTML

<script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.uploadify.js"></script>
<script type="text/javascript">
    $(function () {
        $("[id*=FileUpload1]").fileUpload({
            'uploader': 'scripts/uploader.swf',
            'cancelImg': 'images/cancel.png',
            'buttonText': 'Attach Files',
            'script': 'UploadCS.ashx',
            'folder': 'uploads',
            'multi': true,
            'auto': true,
            'scriptData': { key: '<%=Key %>' },
            'onSelect': function (event, ID, file) {
                $("#attachedfiles tr").each(function () {
                    if ($("td", this).eq(0).html() == file.name) {
                        alert(file.name + " already uploaded.");
                        $("[id*=FileUpload1]").fileUploadCancel(ID);
                        return;
                    }
                });
            },
            'onComplete': function (event, ID, file, response, data) {
                $("#attachedfiles").append("<tr><td>" + file.name + "</td><td><a href = 'javascript:;'>[x]</a></td></tr>");
            }
        });
    });

    $("#attachedfiles a").live("click", function () {
        var row = $(this).closest("tr");
        var fileName = $("td", row).eq(0).html();
        $.ajax({
            type: "POST",
            url: "CS.aspx/RemoveFile",
            data: '{fileName: "' + fileName + '", key: "<%=Key %>" }',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function () { },
            failure: function (response) {
                alert(response.d);
            }
        });
        row.remove();
    });
</script>
<table>
    <tr>
        <td>
            To:
        </td>
        <td>
            <asp:TextBox ID="txtTo" runat="server"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            Subject:
        </td>
        <td>
            <asp:TextBox ID="txtSubject" runat="server"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            Body:
        </td>
        <td>
            <asp:TextBox ID="txtBody" runat="server" TextMode="MultiLine"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
        </td>
        <td>
            <asp:FileUpload ID="FileUpload1" runat="server" />
        </td>
    </tr>
    <tr>
        <td>
        </td>
        <td>
            <table id="attachedfiles">
            </table>
        </td>
    </tr>
    <tr>
        <td>
        </td>
        <td>
            <asp:Button ID="btnSend" runat="server" Text="Send" OnClick="btnSend_Click" />
        </td>
    </tr>
</table>

Namespaces

C#

using System.Web.Services;
using System.Net.Mail;
using System.IO;

Code

UploadCS.ashx

<%@ WebHandler Language="C#" Class="UploadCS" %>
using System;
using System.Web;
using System.IO;
using System.Collections.Generic;
public class UploadCS : IHttpHandler {
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        context.Response.Expires = -1;
        try
        {
            List<HttpPostedFile> files = (List<HttpPostedFile>)context.Cache[context.Request.QueryString["key"]];
            HttpPostedFile postedFile = context.Request.Files["Filedata"];
            files.Add(postedFile);
            string filename = postedFile.FileName;
            postedFile.SaveAs(HttpContext.Current.Server.MapPath("~/Uploads/") + filename);
            context.Response.Write(filename);
            context.Response.StatusCode = 200;
        }
        catch (Exception ex)
        {
            context.Response.Write("Error: " + ex.Message);
        }
    }
 
    public bool IsReusable {
        get {
            return false;
        }
    }
}

CS.aspx.cs

protected string Key
{
    get { return ViewState["Key"].ToString(); }
    set { ViewState["Key"] = value; }
}
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        this.Key = Guid.NewGuid().ToString();
        Cache[this.Key] = new List<HttpPostedFile>();
    }
}

[WebMethod]
public static void RemoveFile(string fileName, string key)
{
    List<HttpPostedFile> files = (List<HttpPostedFile>)HttpContext.Current.Cache[key];
    File.Delete(HttpContext.Current.Server.MapPath("~/Uploads/") + fileName.ToLower());
}