将 ViewModel 从 javascript 文件传递到代码隐藏答案

【问题标题】：Pass ViewModal from javascript file to code-behind将 ViewModel 从 javascript 文件传递到代码隐藏
【发布时间】：2013-11-23 12:11:44
【问题描述】：

我有一个 Javascript 文件，它在我的代码隐藏中调用一个方法。如果我创建一个无参数的默认构造函数示例 1，这似乎可行，但我想将我的 ViewModel 示例 2 传递给 save 方法。当我这样做时，我得到一个 500 错误。在深入挖掘后，我发现了有关该网络错误的更多详细信息。

无参数默认构造函数 - 这有效，但前提是其他构造函数被注释掉。

示例 1

[HttpPost]
public JsonResult SaveWorkRequestDetails()
{
    return Json(new {});
}

如果我在代码隐藏文件中同时拥有这两个，则会收到此错误：控制器类型“WorkRequestController”上的当前操作请求“SaveWorkRequestDetails”在以下操作方法之间不明确： System.Web.Mvc.JsonResult SaveWorkRequestDetails() on type WorkRequest.Controllers.WorkRequestController System.Web.Mvc.JsonResult SaveWorkRequestDetails(WorkRequest.ViewModel.WorkRequestViewModel) on type WorkRequest.Controllers.WorkRequestController

示例 2

[HttpPost]
public JsonResult SaveWorkRequestDetails(WorkRequestViewModel viewModel)
{
    // TODO: Save logic goes here
    return Json(new { });
}

我需要传递 viewModel 以保存用户的选择。我错过了一些东西，我不确定是什么。

RegisterUIEventHandlers: function () {
    $('#Save').click(function (e) {
        // Check whether the form is valid. Note: Remove this check, if you are not using HTML5
        if (document.forms[0].checkValidity()) {
            e.preventDefault();
            $.ajax({
                type: "POST",
                url: WorkRequest.SaveUrl,
                data: ko.toJSON(WorkRequest.ViewModel),
                contentType: 'application/json',
                async: true,
                beforeSend: function () {
                    // Display loading image
                    alert(ko.toJSON(WorkRequest.ViewModel));
                },
                success: function (result) {
                    // Handle the response here.
                },
                complete: function () {
                    // Hide loading image.
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    // Handle error.
                }
            });
        }
    });
}

在您在 beforeSend 中看到的警报中，在上面 javascript 中的 AJAX POST 中，我看到了用户所做的选择。一切正常，所以我只想将它传递给控制器的 SaveWorkRequestDetails，请问我该怎么做。我的理解是 data 参数将其传递给 url 参数中指定的方法。

【问题讨论】：

标签： json jquery asp.net-mvc-4

【解决方案1】：

错误信息很清楚。您有两个具有相同名称的操作方法。因此，如错误所示，调用 SaveWorkRequestDetails 是模棱两可的。

您可以在 C# 中重载函数，但在 ASP.NET MVC 框架中是不可能的。

在 ASP.NET MVC 中的同一控制器上不可能有两个具有不同方法签名的 SaveWorkRequestDetails() 操作。

只需删除第一个SaveWorkRequestDetails()，就可以了。

【讨论】：

我添加了没有任何参数的那个，因为示例 2 从未被调用过。理想情况下，我只想将您看到的 Save 方法作为第二个示例。
从未调用过，您的意思是 WorkRequestViewModel 为 null 还是说，ajax 是从未发送过的请求？
我的意思是我在那里放置了一个断点并且它永远不会到达。如果我在示例 2 中只有 Save 方法，我会得到一个不同的错误：没有为此对象定义无参数构造函数。
我在这里看了看：stackoverflow.com/questions/12700943/… 并将我的 Index.cshtml 更改为：@Html.DropDownListFor(m => m.WorkSections.SelectedValue, Model.WorkSections, "--> Select Item
好的，我现在调用了示例 #2 中的 Save 方法，但我的 ViewModel 为空。不知道为什么，但我已经解决了这个问题。

【解决方案2】：

我将 dataType 更改为 json 而不是 application/json。这解决了错误指出没有无参数默认构造函数的问题。现在正在调用 SaveWorkRequestDetails。

RegisterUIEventHandlers: function () {
    $('#Save').click(function (e) {
        // Check whether the form is valid. Note: Remove this check, if you are not using HTML5
        if (document.forms[0].checkValidity()) {
            e.preventDefault();
            $.ajax({
                type: "POST",
                url: WorkRequest.SaveUrl,
                data: ko.toJSON(WorkRequest.ViewModel),
                dataType: 'json',
                async: true,
                beforeSend: function () {
                    // Display loading image
                    alert(ko.toJSON(WorkRequest.ViewModel));
                },
                success: function (result) {
                    // Handle the response here.
                },
                complete: function () {
                    // Hide loading image.
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    // Handle error.
                }
            });
        }
    });

【讨论】：