提交的Ajax复选框可以防止点击发布/提交

Hi I'm working on an ajax function in jquery that saves the value of a checkbox. Here is my question, What if the user clicks in multiple times even the saving is not yet finished/success? How can i Prevent the user to tick the checkbox when the form is submitting? Thanks !

嗨,我正在jquery中使用ajax函数来保存复选框的值。这是我的问题,如果用户多次点击甚至保存尚未完成/成功怎么办?我如何在表单提交时阻止用户勾选复选框?谢谢 !

Heres my Code Snippet:

继承我的代码片段:

$(".chkOverride").click(function (e) {
            var userId = $("#UserId").val();
            var isChecked = $(this).is(":checked")
            $.ajax({
                url: "/Worker/Worker?Id=" + Id + "&isChecked=" + isChecked + "&UserId=" + UserId,
                type: "post",
                success: function (result) {
                    alert("Success!");
                    location.reload();

                },
                error: function () {
                }
            });
        });

2 个解决方案

#1

You can disable the checkbox before starting the ajax call. You may use the prop() method to do that. Set the disabled property value to true

您可以在启动ajax调用之前禁用该复选框。您可以使用prop()方法来执行此操作。将disabled属性值设置为true

$(".chkOverride").click(function (e) {

      var _this=$(this);
      _this.prop('disabled', true);

      var userId = $("#UserId").val();
      var isChecked = $(this).is(":checked")
      $.ajax({
                url: "/Worker/Worker?Id=" + Id + "&isChecked=" + 
                                                       isChecked + "&UserId=" + UserId,
                type: "post",
                success: function (result) {
                    alert("Success!");
                   //No point in enabling as you are going to reload the page
                   _this.prop('disabled', false);
                    location.reload();

                },
                error: function () {
                  alert("Error :(");
                   _this.prop('disabled', false);
                }
          });
});

#2

Have you come across this link:

你有没遇到这个链接:

Inhibit a checkbox from changing when clicking it

禁止在单击时更改复选框

You can disable the checkbox using

您可以使用禁用复选框

$this.attr('disabled', 1);

Disable the button before making the Ajax call.

在进行Ajax调用之前禁用该按钮。

#1