首页 > 解决方案 > 无法通过 ajax 调用将复杂模型传递给控制器

问题描述

每当单击按钮时,我都会尝试更新我的模型。当我将我在剃刀文件中发送的数据记录到控制台时,数据就在那里。但是,当调用控制器方法时,模型是空的。

我的点击方法:

function addCoupon() {
  var code = document.getElementById("coupon-entry").value;
  $.ajax({ // Validate coupon first. This is working.
    method: "post",
    url: `/cart/validate-coupon/` + code,
    contentType: "application/json; charset=utf-8"
  }).done(result => {
    if (result.success) {
      var model = @Html.Raw(Json.Serialize(Model));
      console.log(model); // Countries and CheckoutData are correct here
      $.ajax({
        method: "post",
        url: `/cart/add-coupon/` + code,
        contentType: "application/json; charset=utf-8",
        data: model
      }).done(result => {
        console.log("It worked");
      });
    }
  });
}

我的模型:

public bool IsPos { get; set; }
public List<CountryDto> Countries { get; set; }
public CheckoutData CheckoutData { get; set; }
public string Payment ProcessorError { get; set; }
public bool DisplayRequiredErrors { get; set; }
public List<string> ValidationErrors { get; set; } = new List<string>();
public PaymentInformationModel PaymentInformation { get; set; } = new PaymentInformationModel();
public bool UseSavedCard { get; set; }

我的控制器:

[HttpPost("add-coupon/{code}")]
public async Task<IActionResult> AddCouponAsync(string code, CheckoutModel model)
{
  // Countries and CheckoutData are null here
}

这里发布了几个类似的问题,但它们要么都有简单的模型,要么有在我尝试时对我不起作用的解决方案。

谢谢!

标签: javascriptc#ajaxrazor

解决方案


您应该尝试将其更改为此(否则它不是有效的 javascript):

(注意需要用''封装)

var model = '@Html.Raw(Json.Serialize(Model))';

推荐阅读