单击按钮时运行控制器方法MVC4 C#

Run Controller Method when Button is clicked MVC4 C#

本文关键字:方法 MVC4 控制器 运行 按钮 单击      更新时间:2023-09-26

我正在使用visual studio 2013、MVC4和C#制作一个简单的应用程序。此web应用程序有一个带有多个复选框的表,并且默认情况下取消了"更新"按钮。当单击一个或多个复选框时,我会激活该按钮。

这里的想法是,当单击UPdate按钮时,将复选框的所有信息(哪些是打开或关闭的)发送到服务器,然后将这些更改保存在DB中。

为了实现这一点,我试图通过jquery使用ajax,但不幸的是,我没有成功,因为当我点击按钮时,什么都不会发生。

这是我用来为客户端生成视图的cshtml文件:

<input type="submit" value="Save Checkbox Changes" class="btn btn-primary disabled" id="SaveCheckboxChanges" />
<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.RequiresSetup)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Disabled)
        </th>
    </tr>
    @{
        foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.EditorFor(modelItem => item.RequiresSetup)
                </td>
                <td>
                    @Html.EditorFor(modelItem => item.Disabled)
                </td>
            </tr>
        }
}
</table>

按钮SaveCheckboxChanges的javascript代码如下:

$("#SaveCheckboxChanges").click(function (event) {
        if (!$("#SaveCheckboxChanges").hasClass("disabled")) {
            $.ajax({
                url: '/Material/UpdateCheckBoxes',
                type: 'POST',
                data: {bla: "bdsjdnjsdnsnd"
                },
                contentType: 'application/json; charset=utf-8',
                success: function (data) {
                    alert(data.success);
                },
                error: function () {
                    alert("error");
                }
            });
        }
    });

在我的材料控制器中,我有以下内容:

[HttpPost]
public ActionResult UpdateCheckBoxes(string bla)
{
    return Content("Working!" +  bla);
}

我所期望的是,点击按钮后,页面会显示"Working"字符串,这意味着控制器中的功能被正确执行。

然而,这并没有发生,我看到的只是javascript警报,上面写着"error"。

如何使这个ajax请求工作?我错过了什么?

您的控制器方法不返回任何结果。。。

将其转换为以下内容::

public String Material()
{
    return "Working!";
}

事情不是这样运作的。当您调用Response.Write来响应AJAX请求时,实际的AJAX响应是字符串"Working!"。任何内容都不会写入页面,除非您自己将该字符串添加到DOM中。

我在您的代码中看到了3个不正确的地方。

1) [ValidateAntiForgeryToken]您没有在ajax调用中实现它,所以应该在控制器中删除它。(我不知道如何将它与JQuery一起使用)。

2) 如果您的控制器名为"MaterialController:cs",并且您没有更改路由配置,则要使用的URL为:"/Material/Material'。

3) 您的函数返回"void"。用字符串或ActionResult替换void。然后,将您的"Response.write"替换为返回"some string"。

问题出在Ajax调用中。以下是解决方案:

$.ajax({
                url: "Controler/Action",
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                traditional: true,
                data: JSON.stringify({ requiresSetupArray: requiresSetupArray, disabledArray: disabledArray }),
                success: function (data) {
                    button.attr('value', 'Save Checkbox Changes');
                    button.addClass('disabled');
                },
                error: function () {
                    alert("error");
                }
            });

需要注意的几件事:

  • Stringify很重要。没有它,什么都不管用
  • 小心contentType
  • 小心检查控制器正在检测的参数

希望它将来能帮助到别人!