Question

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

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

所以，一段代码：

  @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()" />

Answer 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) {

            }
        });
    });
});

在此示例中，我们订阅了每个复选框的change事件。当这个事件被触发时，我们会查找包含的表单并使用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)
{
    ...
}

Answer 2

如果您不需要或不想要AJAX，只想提交表单，那么

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

会这样做。

提交复选框状态而不提交按钮

2 个答案: