没有提交按钮的提交复选框状态答案

【问题标题】：Submit checkbox state without a submit button没有提交按钮的提交复选框状态
【发布时间】：2012-03-27 14:36:27
【问题描述】：

我有一个带有几个复选框的视图，可以选中或取消选中。我希望始终在复选框中注册任何更改，而不使用提交按钮（用户可能会忘记这样做，这会浪费时间）。

那么，有没有办法在视图中处理这个问题？到目前为止，我只使用控制器来完成这项工作。

那么，一段代码：

  @ModelType MvcApplication.OpportuniteDetails

  @Code
       ViewData("Title")="Details"
  @End Code

  <script type="text/javascript">
  $(function () {
    $(':checkbox').change(function() {
        $.ajax({
            url: '@Url.Action("update")',
            type: 'POST',
            data: { isChecked: $(this).is(':checked') },
            success: function (result) { }
        });
    });
  });
  </script>
  [... Some code here...]
  @Html.Raw("Mail sent?") @Html.CheckBox(Model.Opportunite.Mail)

  <input type="checkbox" name="mail" id="mail" onclick="test()" />

【问题讨论】：

标签： javascript vb.net asp.net-mvc-3 razor

【解决方案1】：

你可以使用 AJAX：

$(function() {
    $(':checkbox').change(function() {
        var form = $(this).closest('form');
        $.ajax({
            url: form.attr('action'),
            type: form.attr('method'),
            data: form.serialize(),
            success: function(result) {

            }
        });
    });
});

在本例中，我们订阅每个复选框的更改事件。当触发此事件时，我们会查找包含的表单并使用 AJAX 请求将其内容发送到服务器。

如果您只想将当前复选框状态提交给服务器而不是整个表单：

$(function() {
    $(':checkbox').change(function() {
        $.ajax({
            url: '@Url.Action("SomeAction")',
            type: 'POST',
            data: { isChecked: $(this).is(':checked') },
            success: function(result) {

            }
        });
    });
});

你可以有一个控制器动作来进行必要的处理：

[HttpPost]
public ActionResult SomeAction(bool isChecked)
{
    ...
}

【讨论】：

非常感谢，在阅读有关 AJAX 的操作指南后，我会检查一下，以了解我的工作。所以，我肯定会在明天回答
我已经编辑了我的问题。我已经阅读了一些关于 javascript/ajax 的内容。像我一样应用你的代码是不够的。我没有进入我创建的控制器
通过发出警报，我看到代码在“change(function){...}”内运行，但不在“$.ajax({...})”内.这部分代码应该做什么？你能给我一些关键字来帮助我找到有关它的信息吗？
@patxy，$.ajax 函数（顾名思义）向给定 url 发送 AJAX 请求并传递包含在 data 参数中的参数。所以在本例中，它将调用SomeAction 操作并将isChecked=true 或isChecked=false 参数传递给它。您可能会考虑阅读更多关于 AJAX 的一般信息，并使用 javascript 调试工具（例如 FireBug）来准确查看发送到服务器的内容并分析请求和响应。

【解决方案2】：

如果您不需要或不想要 AJAX 并且只想提交表单，则此

$(':checkbox').change(function() {
    var form = $(this).closest('form');
    form.get( 0 ).submit();
});

会做的。

【讨论】：