Question

我正在从事MVC项目。我有一个表格如下：

<div id="horizontal-form">
            @using (Html.BeginForm("Send", "Ticket", FormMethod.Post, new
            {
                @class = "form-horizontal",
                role = "form",
                id = "form_send_ticket",
                enctype = "multipart/form-data"
            }))
            {

                @**** I have about 20 filed's of other types here ****@
                 ......

                @**** Image file ****@
                @Html.TextBoxFor(x => x.Image, new { type = "file" })


                <div>
                    <button type="button" class="btn btn-success" id="send_ticket">Insert</button>
                </div>
            }

 </div>

我的ViewModel：

  public class SendViewModel
{
    //I have about 20 filed's of other types here
    .....

    //Image file
    public HttpPostedFileBase Image { get; set; }

}

我的JQuery ajax：

   $("#send_ticket").click(function () {
        var form = $("#form_send_ticket");

        $.ajax({
            type: "POST",
            url: '@Url.Action("Send", "Ticket")',
            data: form.serialize(),
            contentType: "multipart/form-data",
            success: function (data) {
                //do something
            },
            error: function (e) {
               //do something
            }
        });
    })

我的控制器动作是这样的：

 [HttpPost]
    public ActionResult Send(SendViewModel ticket)
    {
       //Do something
       return Json(new { });

    }

在我遇到这种情况之前，我的意思是在其他项目中，大多数我有大约3到8个字段，包括图像文件和其他一些类型，我将它们逐个追加到FormData（因为那个图像文件）然后通过ajax请求发送它们，这对我来说无关紧要，但现在我有大约22个字段，虽然这样做很少。所以我决定序列化表单并发送它通过ajax请求，并且它在所有字段中都运行良好，除了Image，我将其设置为ViewModel中的类型HttpPostedFileBase。任何想法如何使用data: form.serialize()？

使用表单发送此字段

感谢您的帮助：）

更新：让我明确一点：

1 - 我不希望FormData通过ajax发送，我想使用form.serialize()发送。

2-Don想要使用现成的文件插件。

3 - 我并不仅仅意味着一个图像领域，我的意思是整个形式有23个领域。

Answer 1

无法使用jQuery Ajax发布/上传文件，除非您要使用FormData或内部使用iFrame实现的一些插件。

在MVC中使用JQuery ajax form.serialize（）发送HttpPostedFileBase字段

1 个答案: