使用ajax调用将Model作为列表从View传递到Controller

本文关键字：View Controller 列表 调用 ajax Model 使用 | 更新日期: 2023-09-27 18:25:06

我在尝试使用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据传递）。

更新

方法签名：

[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; }
    }

谢谢。

使用ajax调用将Model作为列表从View传递到Controller

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

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

这样做：

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'
    });

您必须首先将数据解析为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) {
                }
            });
        });

希望这能有所帮助。

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

$(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提交表单的事件的按钮不应该是submit类型！否则，这将永远失败。

相关文章：