使用ajax将对象发送到asp.net mvc中的控制器答案

【问题标题】：Sending object to a controller in asp.net mvc using ajax使用ajax将对象发送到asp.net mvc中的控制器
【发布时间】：2016-05-25 07:26:31
【问题描述】：

我在向控制器发送包含数组的对象时遇到问题

这是我的 js 代码

  var messageId = 0;
    function DraftMessage()
    {
        var to = [];
        var i = 0;
        $('#to option:selected').each(function (index, element) {
            to[i++] = $(element).val();
        });
        console.log(to);
        $.ajax({
            type: "POST",
            url: "@Url.Action("DraftMessage", "Activities")",
            datatype: "json",
            traditional: true,
            async: false,
            data: { "id": messageId, "To": to, "Title": $("#title").val(), "Project": $("#project").val(), "AreaId": $("#areaId").val(), "Body": $("#messageBody").val() },
                beforeSend: function () { }
        }).done(function (Id) {
            console.log(Id);
            messageId = Id;
        });
    }
    $("input, select, textarea").change(function () { DraftMessage(); });
    var contents = $('.note-editable').html();
    $(".compose-message").on("blur", ".note-editable", function () {
        if (contents != $(this).html()) {
            DraftMessage();
            contents = $(this).html();
        }
    });

这是我的控制器端

    public int DraftMessage(message draftMessage, HttpPostedFileBase[] files = null)
    {
        return new MessageActions().DraftMessage(draftMessage);
    }

我的问题是 ajax 请求总是将 to 数组作为 null 发送，我不知道出了什么问题，所以任何人都可以帮我解决这个问题。

【问题讨论】：

你在哪里将文件输入数据数组添加到数据中？看看这个stackoverflow.com/questions/34603739/…

标签： c# jquery asp.net ajax asp.net-mvc

【解决方案1】：

你能改变你的要求并使用

dataType: "json",
contentType: "application/json;charset=utf-8",

这应该可行。请告诉我。

【讨论】：

【解决方案2】：

试试这个。将您的对象推送到数组并将其作为 Json 发送。

array.push({yourobject datas here})
    $.ajax({
        type: "POST",
        url: '/DraftMessage/Activities',
        contentType: 'application/json',
        data: JSON.stringify(array),
        success: function (d) {
            ..
        },
        error: function (xhr, textStatus, errorThrown) {

            console.log(errorThrown);
        }
    });

将控制器函数的返回类型转换为 JSonResult。希望有所帮助。

【讨论】：

【解决方案3】：

你想使用 ajax 上传文件吗？！！

使用表单的正常用法而不是 Ajax.BeginForm 然后在表单提交事件中像这样写你的代码：

 $('#Form').submit(function () {
        var xhr = new XMLHttpRequest();
        var fd = new FormData();

        var file = $('#Image').val();
        if (file) {
            var fname = $('#Image')[0].files[0].name;

            if (CheckFile(file)) {
                var uploadFile = document.getElementById('Image').files[0];
                var myArray = [];
                myArray.push(uploadFile);
                if (myArray.length > 0) {
                    for (var i = 0; i < myArray.length; i = i + 1) {
                        fd.append("File1", myArray[i]);
                    }
                }
            }
            else {
                return false;
            }
        } 


        fd.append("ID", messageId);
        fd.append("Title", $('#Title').val());
        fd.append("Project", $('#Project').val());
        fd.append("AreaId", $('#AreaId').val());
        fd.append("Body", $('#messageBody').val());

        var form = $('#Form');
        var token = $('input[name="__RequestVerificationToken"]', form).val();
        fd.append("__RequestVerificationToken", token);
        xhr.open("POST", "/ControllerName/Action/", true);
        xhr.send(fd);

        xhr.addEventListener("load", function (event) {
        if (event.target.response != "OK") {
            OnFail(event.target.response);
        }
        else {
            OnSuccess(event);
        }
         }, false);
        return false;
         })

控制器中的服务器端：

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult actionName(Model pModel){

    HttpPostedFileBase File = Request.Files["File1"];
    if (File != null && File.ContentLength != 0){
                 //do what you want
      return Content("OK");
    }
    else{
     Response.StatusCode = (int)System.Net.HttpStatusCode.BadRequest;
                return Content("Error Messages",        System.Net.Mime.MediaTypeNames.Text.Plain);
    }

    }

【讨论】：

【解决方案4】：

您可以尝试不同的方法。您可以通过执行以下操作来序列化整个表单：

var formdata = $("#frmEmailInfo").serialize();

然后将其发布到控制器：

   $.ajax(
            {
                type: "POST",
                data: formdata,
                dataType: 'json',...

【讨论】：