使用 ajax 调用将模型作为列表从视图传递到控制器答案

【问题标题】：Pass Model as a list from View to Controller using ajax call使用 ajax 调用将模型作为列表从视图传递到控制器
【发布时间】：2014-09-30 09:18:44
【问题描述】：

我无法尝试使用 ajax 调用发送我的整个模型，它实际上是一个 List<Account>。

提供以下代码：

@model List<ValidationAccount>

<input type="button" id="SubmitAccounts" value="Final Proceed">

$("#SubmitAccounts").click(function () {
            $.ajax({
                url: '/setupAccounts/ActivateAccounts',
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                cache: false,
                dataType: 'json',
                data: JSON.stringify(Model),
                success: function (data) {
                    $(body).html(data);
                }, error: function (data) {
                }
            });
        });

我尝试过使用简单的 Model 和 @Model 但不起作用。在这种情况下我能做什么？（所以我想将我的模型（我的列表）作为 data 传递）。

更新

方法签名：

[HttpPost]
public string ActivateAccounts(List<ValidationAccount> Accounts)
{
    return "Success";
}

更新 2

我的模特：

public class ValidationAccount
    {
        public string Faculty { get; set; }
        public string Programme { get; set; }
        public string Year { get; set; }
        public string Email { get; set; }
    }

谢谢。

【问题讨论】：

您是否检查过发布的数据是否为有效的 JSON？
是的。这是。幸运的是。
您有form 和每个属性的输入吗？
'@Model' 将返回 "System.Collections.Generic.List[YourAssembly.ValidationAccount]" 而不是集合中的对象。既然你没有修改任何东西，为什么你需要将模型传回ActivateAccounts()？ - 再次从数据库中获取它（无论如何这将是更好的性能）
你为什么会失去他们？当然，您使用生成集合来呈现此视图的任何代码都可以再次用于在 ActivateAccounts() 中生成集合

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

【解决方案1】：

使用@Model 将返回集合的名称，例如"System.Collections.Generic.List[YourAssembly.ValidationAccount]"，而不是集合中的对象。您可以将集合序列化到 ViewBag，然后将其发回（未经测试），但双向发送数据似乎对性能造成了不必要的影响。

相反，您可以将来自Proceed 方法的过滤结果存储在会话中，并在ActivateAccounts 方法中检索它以避免发回任何内容。

【讨论】：

【解决方案2】：

这样做：

data: { Accounts: JSON.stringify('@Model') }

并将traditional 属性设置为true：

data: { Accounts: JSON.stringify('@Model') },
traditional:true

更新：

 var accounts= { Accounts: '@Model' };

和：

$.ajax({
        type: 'POST',
        url: '/{controller}/{action}',
        cache: false,
        data: JSON.stringify(accounts),
        dataType: 'json', 
        contentType: 'application/json; charset=utf-8'
    });

【讨论】：

好吧，不幸的是它不起作用。我的参数仍然是null。查看更新。
好的。取得了进展。但是在发送模型时，我得到的不是 2 个项目（实际上我显示在我的视图中），而是 0。Tx

【解决方案3】：

您必须首先将数据解析为json

试试

var parsedData = @Html.Raw(Json.Encode(Model)); // This will change the model to json

然后将parsedData 传递给ajax 调用

$("#SubmitAccounts").click(function () {
            $.ajax({
                url: '/setupAccounts/ActivateAccounts',
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                cache: false,
                dataType: 'json',
                data: parsedData,
                success: function (data) {
                    $(body).html(data);
                }, error: function (data) {
                }
            });
        });

希望这会有所帮助。

【讨论】：

【解决方案4】：

将整个模型传递回控制器方法的最佳方法是序列化表单，如下所示...

$(document).ready( function() {
  var form = $('#Form1');

 $('#1stButton').click(function (event) {

    $.ajax( {
      type: "POST",
      url: form.attr( 'action' ),
      data: form.serialize(),
      success: function( response ) {
        console.log( response );
      }
    } );
  } );
}

注意：您用来触发通过 ajax post 提交表单的事件的按钮不应该是提交类型！否则这将永远失败。

【讨论】：