jquery - 我可以在 asp.net mvc 的 jquery 对话框中上传文件吗

Question

我有一个表单，用户可以在其中输入其数据及其图像。该表单将位于 jquery 对话框中。我想知道是否有可能，如果我上传图像，然后将其发送到服务器以保存在硬盘驱动器上，然后不会丢失该对话框，则打印您上传的文件的消息。如果是，那么我如何使用 jquery ajaxform plugin 。我使用的是 asp.net mvc。

我尝试过的方法如下

我的观点

<div id="dialog" title="Dialog Title" style="display: none">
        <div id="Jobs">
        <form id="frmupload" enctype="multipart/form-data" method="post">
            <input id="File1" type="file" name="file" />
            <input id="Button1" type="submit" value="Upload" name="button" /> 
            </form>
        </div>
    </div>

我的 JQuery

function dialogs(id) {
        $(function () {
            var ph = $("#Jobs");           
                ph.dialog({
                    width: 700,
                    modal: true,
                    show: 'slide',
                    closeText: 'hide',
                    draggable: false,
                    resizable: false
                });
            //});
        });
    }

    function clik(id) {
        dialogs(id);
        return false;
    }
 var options = {
            url: "/Post/UploadImages"            
        };       

        $('#frmupload').ajaxForm(function (options) {
            //alert(data);
            alert("Thank you for your comment!");
        });

Answer 1

查看以下使用 AJAX 文件上传的示例(不幸的是，似乎没有给出 JavaScript):

http://jquery.malsup.com/form/#file-upload

基本上，您需要包含 iframe您的属性(property)options对象:

var options = {
    url: "/Post/UploadImages",
    iframe: true
}; 

问题是该插件需要一个包含在 <textarea></textarea> 中的响应。标签(因为响应类型必须是 HTML 或 XML)。您可以通过引入您自己的响应类型来处理 AJAX 文件上传来方便地完成此操作，如博客文章 here 中所述。 :

public class FileUploadJsonResult : JsonResult
{
    public override void ExecuteResult(ControllerContext context)
    {
        this.ContentType = "text/html";
        context.HttpContext.Response.Write("<textarea>");
        base.ExecuteResult(context);
        context.HttpContext.Response.Write("</textarea>");
    }
}

然后在你的 Controller 操作中:

return new FileUploadJsonResult { Data = new { /* ... */ } };