如何通过jQuery上传文件?

cho*_*bo2 5 c# asp.net-mvc jquery

我想知道如何使用jQuery ajax这样做.现在我有一个jQuery ui对话框弹出窗口,它上面有一个html输入文件.

现在当用户点击导入时,我想用jQuery向服务器发一个ajax帖子.

我不知道如何将文件传递到我的操作视图.

现在我有一个完整的帖子,所以我有这个

<% using (Html.BeginForm("Import", "Controller", FormMethod.Post, new { enctype = "multipart/form-data" }))
{%>
    <br />
    <p><input type="file" id="file" name="file" size="23 accept="text/calendar"></p><br />
    <p><input type="submit" value="Upload file" /></p>        

<% } %> 
Run Code Online (Sandbox Code Playgroud)

然后在我的控制器中

  public ActionResult Import(HttpPostedFileBase file)
Run Code Online (Sandbox Code Playgroud)

所以我不知道如何使用jQuery传递HttpPostedFileBase以及如何enctype = "multipart/form-data"在jQuery中设置.

编辑

好吧,jQuery表单插件似乎是要走的路.

$('#frm_ImportCalendar').livequery(function()
{
    var options = {
        dataType: 'json',
        success: function(response)
        {
            alert(response);
        }
    };

    $(this).ajaxForm(options);
});
Run Code Online (Sandbox Code Playgroud)

我想知道为什么我的json没有工作,但有人提到你不能正常使用它.我正在查看有人能够使用json的其他链接.

我不确定为什么Lck在ajax submit方法之前使用.submit.

编辑

如何更改文件上传json结果以返回我的字典数组?

        Dictionary<string, string> result = new Dictionary<string, string>();
        result.Add("Msg", "Success!!");
        result.Add("Body", calendarBody);

// how can I change this?
    return new FileUploadJsonResult { Data = new { message = string.Format("{0} uploaded successfully.", System.IO.Path.GetFileName(file.FileName)) } };
Run Code Online (Sandbox Code Playgroud)

小智 4

使用 jQuery Form Plugin,您可以完成异步文件上传。查看以下链接,

jQuery 表单插件 - 代码示例 - 文件上传 http://jquery.malsup.com/form/#file-upload

祝你好运!