使用jquery ajax post将数组传递给控制器​​失败

Question

我有一个输入表单，使用与此类似的模型呈现。为了清晰起见，我试图简化示例。

[Serializable]
public class OrderDetailsModel
{ 
    public string FirstName { get; set; }
    public string Surname { get; set; }

    public Address[] OrderAddresses { get; set; }
}

[Serializable]
public class Address
{ 
    public string BuildingNameNumber { get; set; }
    public string Town { get; set; }
    public string Postcode { get; set; }
}

使用类似于此

的Razor标记进行渲染

<form id="orderForm">
    <div>
        @Html.LabelFor(model => model.FirstName)
    </div>
    <div>
        @Html.EditorFor(model => model.FirstName)
    </div>
    <div>
        @Html.LabelFor(model => model.Surname)
    </div>
    <div>
        @Html.EditorFor(model => model.Surname)
    </div>


    @for (int i = 0; i < 3; i++)
    {
        var addressDisplayDivId = $"addressDisplay{i}";

        <div id="@addressDisplayDivId">
            <div>
                @Html.LabelFor(model => model.OrderAddresses[i].BuildingNameNumber)
            </div>
            <div>
                @Html.EditorFor(model => model.OrderAddresses[i].BuildingNameNumber, new {@id = $"buildingNameNumber{i}"})
            </div>
            <div>
                @Html.LabelFor(model => model.OrderAddresses[i].Town)
            </div>
            <div>
                @Html.EditorFor(model => model.OrderAddresses[i].Town, new {@id = $"town{i}"})
            </div>
            <div>
                @Html.LabelFor(model => model.OrderAddresses[i].Postcode)
            </div>
            <div>
                @Html.EditorFor(model => model.OrderAddresses[i].Postcode, new {@id = $"postcode{i}"})
            </div>
        </div>
    }

    <a href="/MyController/ActionMethod" id="submit">Submit</a>
</form>

我正在尝试使用jQuery ajax发布表单

$("#submit").click(function(e) {
     e.preventDefault();

     var submitUrl = $("#submit").attr("href");
     var model = $("#orderForm").serialize();
     $.ajax({
         type: "POST",
         url: submitUrl,
         data: model,
         success: function(result) {
             alert("Success");
         },
         error: function(result) {
             alert("Error");
         }
     });
 });

到控制器动作

public MyController
 {
     public ActionResult ActionMethod(OrderDetailsModel model)
     {
     }
 }

问题是我的行动没有被调用。如果我删除地址[]它可以正常工作，但在模型中引入这种复杂性似乎可以阻止该操作发布。

问题似乎在于jquery序列化以及它在发布到操作之前如何构造Address数组。

有人可以建议一种解决方法吗？

Answer 1

管理推断实际上发生了隐藏错误，即使我们从Ajax调用中获得了成功响应。

错误是

  

收集是只读的

我将地址数组更改为IList：

createDirIfNotExists

到

public Address[] OrderAddresses { get; set; }

问题解决了！