Передача объекта jquery в действие MVC

Question

Я пытаюсь использовать .ajax() для публикации объекта People в действии MVC2, которое ожидает ViewModel в качестве параметра.ViewModel имеет свойство People.

Проблема заключается в том, что при активации действия MVC объект ajax() postback People всегда равен нулю.Я использовал Fiddler для диагностики проблемы.Все значения свойств в объекте People содержатся в заголовке.Вот мой клиентский скрипт jQuery.Обратите внимание, что я использовал три метода для вставки значений свойств в объект People, но ни один из них не работает.

        StaffDlg.delegate("#SaveButton", "click",
        function (e) {
            e.preventDefault();

            People["PKey"] = $("#PKey").val();
            People["FName"] = $("#FName").val();
            People["LName"] = $("#LName").val();
            People["MName"] = $("#MName").val();
            People["SSN"] = $("#SSN").val();
            People["Gender"] = $("#Gender").val();
            People["DOB"] = $("#DOB").val();
            People["BirthPlace"] = $("#BirthPlace").val();
            People["NetworkAccount"] = $("#NetworkAccount").val();

            var pkey = $("#PKey").val();
            var action;

            if (!isNaN(parseFloat(pkey)) && isFinite(pkey)) {
                action = "Edit" + "/" + pkey;
            }
            else {
                action = "Create";
            }

            $.ajax({
                url: getRootUrl() + "/Staff/" + action,
                //data: { FName: $("#FName").val(), LName: $("#LName").val(), MName: $("#MName").val(),
                //  SSN: $("#SSN").val(), Gender: $("#Gender").val(), DOB: $("#DOB").val(),
                //  BirthPlace: $("#BirthPlace").val(), NetworkAccount: $("#NetworkAccount").val()
                //},
                //data: JSON.stringify(People),
                data: $("Form").serialize(),
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                type: "POST",
                success: function (result) {
                    $("#ajaxResponse").addClass("whiteOnGreen").html("Update succeeded");
                },
                error: function (qXHR, textStatus, errorThrown) {
                    $("#ajaxResponse").addClass("whiteOnRed").html("Failed to save the record!\r\n" +
                        textStatus + ": " + errorThrown + "\r\n" +
                        "data : " + JSON.stringify(People));
                }
            })
        } 
    );    

и вот действие MVC.

public ActionResult Edit(int id, StaffViewModel updatedStaff)
    {
        People staff = _staffService.GetStaff(id);

        if (updatedStaff == null)
            return View("NotFound");
        if (ModelState.IsValid)
        {
            TryUpdateModel<People>(staff, "staff"); 
            staff.RecordLastUpdated = DateTime.Now;
            staff.UpdatedBy = HttpContext.User.Identity.Name;
            _staffService.SaveStaff();
            //return RedirectToAction("Index", new { id = thisStaff.PKey });

            if (Request.IsAjaxRequest())
                return this.Json(staff, JsonRequestBehavior.AllowGet);
            else
            {
                if (string.IsNullOrEmpty(updatedStaff.previousURL))
                    return Redirect("/Staff/Startwith/" + staff.LName.Substring(1, 1));
                else
                    return Redirect(updatedStaff.previousURL);
            }
        }
        else
        {
            if (Request.IsAjaxRequest())
            {
                string errorMessage = "<div class='whiteOnRed error'>"
                    + "The following errors occurred:<ul>";
                foreach (var key in ModelState.Keys)
                {
                    var error = ModelState[key].Errors.FirstOrDefault();
                    if (error != null)
                    {
                        errorMessage += "<li>"
                            + error.ErrorMessage + "</li>";
                    }
                }
                errorMessage += "</ul></div>";
                return Json(new { Message = errorMessage });
            }
            else
                return View(updatedStaff);
        }
    }

Answer 1

Попробуйте удалить параметры dataType и contentType из вашего вызова ajax:

$.ajax({
    url: getRootUrl() + "/Staff/" + action,
    data: $("Form").serializeArray(),
    type: "POST",
    success: function (result) {
        $("#ajaxResponse").addClass("whiteOnGreen").html("Update succeeded");
    },
    error: function (qXHR, textStatus, errorThrown) {
        $("#ajaxResponse").addClass("whiteOnRed").html("Failed to save the record!\r\n" +
            textStatus + ": " + errorThrown + "\r\n" +
            "data : " + JSON.stringify(People));
    }
})

Answer 2

Я решил проблему с тем, что .ajax () не публиковал значения формы в действии MVC Create (People person). Это был тип параметра, который отличался от того, который использовался в Edit (StaffViewModel). Теперь оба действия принимают один и тот же тип параметра, StaffViewMode.

Answer 3

Вы заявляете, что форма ожидает StaffViewModel в качестве параметра, а StaffViewModel имеет свойство People ... но вы не передаете полный объект StafFViewModel - вместо этого вы передаете объект People из вызова Ajax и надеетесь, чтосвойство People заполняется на стороне MVC.

Там есть разъединение, и автобиндер не знает, как его соединить.

Попробуйте создать метод контроллера с помощью (int, People) и посмотрите, подходит ли вам это.

В противном случае вам может понадобиться создать пользовательское связующее.