Question

有人可以帮助我如何使用jQuery和ajax将模型发布回控制器。

当我发布表单时，我的控制器正在接收一个空模型。请告诉我我在哪里犯了错误。

型号：

public class AllocateToStore
    {
        public IList<OrderLine> FailureAllocations { get; set; }
        public IList<SelectListItem> AllocationStatus
        {
            get
            {
                // code to fetch list.
            }
        }
    }

 public class OrderLine
    {
        public long Id { get; set; }
        public DateTime Date { get; set; }
        public int Status { get; set; }
    }

控制器：

public ActionResult AutoAllocate()
        {
// This action will load the view with data.
// Get model data and send it to view.

            return View("Allocated",model);
        }

        [HttpPost]
        public ActionResult ResolveUnallocatedOrders(AllocateToStore coll)
        {
// When user changes the selection in grid and post the page I need to get the selection // here. So that I can update that record.
            return null;
        }

视图是

 @model AllocateToStore
    @{
        ViewBag.Title = "Orders";
    }
    @{
        var grid = new WebGrid(Model.FailureAllocations, rowsPerPage: 100);
    }


        if (Model.FailureAllocations.Any())
        {
     <form>
        <div>
            @grid.GetHtml(
                    columns: grid.Columns(
                        grid.Column(columnName: "Order date", header: "Order Date", format: item => item.Order.Date),
                       grid.Column("dropdown", header: "Resolution", format:
                                                                   @<span>
                                                                       @{ var index = Guid.NewGuid().ToString(); }
                                                                       @Html.Hidden("FailureAllocations.Index", index)
                                                                       @Html.Hidden("FailureAllocations[" + index + "].Id", (long)item.Id)
                                                                       @Html.DropDownList("FailureAllocations[" + index + "].Status", new SelectList(Model.AllocationStatus, "Value", "Text", item.Status))
                                                                   </span>
                     )
                    ),
                    tableStyle: "expandable-table",
                    htmlAttributes: new { id = "gridFailureAllocations" }
                )
            <br />
            <input type="submit" value="Resolve" id="resolve-button" />
        </div>
</form>
        }


  @section scripts
{
    <script>
        $("#resolve-button").click(function () {
            debugger;
            alert("here");
            $.ajax({
                url: '/OrderProcessing/ResolveUnallocatedOrders',
                data: $('#form').serialize(),
                type: 'POST'
            });
        });
    </script>
}

谢谢，纳雷什

Answer 1

我没有测试这个答案。这只是建议。请尝试这种方式。

  $.ajax({
      url: o.url,
      type: 'post',
      contentType: "application/x-www-form-urlencoded",
      data: {"FailureAllocations ":JSON.stringify(FailureAllocations), "AllocationStatus":JSON.stringify(AllocationStatus)}',
       .  . . . 
     });

Answer 2

我认为你有一个错误data: $('#form').serialize(),

$('#form')将选择ID为“form”的所有元素。您的表单没有ID，因此您的选择器将无法正常工作。尝试将该行更改为data: $('form').serialize(),，选择器应该有效。

或者，为表单添加“表单”ID，例如<form id="form">和原始选择器$('#form')应该有效。

有关各种jQuery选择器的更多详细信息，请参阅here。

使用MVC3中的ajax jquery将模型发布到控制器

2 个答案: