首页 > 解决方案 > Sweetalert 在确认调用 api 请求时关闭弹出窗口

问题描述

单击确认后我的弹出窗口关闭并再次打开一个显示成功的新弹出窗口。没有加载过程显示的巨大差距。

我已经阅读了有关sweetalert的 ajax 请求的文档。它在那里工作得非常完美,按钮在调用 API 时显示加载。我正在尝试做同样的事情。我想删除我首先打开一个 swal 以确认的请求,如果是,它将调用 api 而不会关闭弹出窗口。

removeSession: function(sessionId){
    var _this = this;
    var errormessage = 'Error! Session not delete';
    var callData = {}
    callData["sessionId"] = 0;
    swal({
        title: "Are you sure?",
        text: "Once deleted, the session will be removed.",
        icon: "warning",
        buttons: true,
        dangerMode: true,
      })
      .then((willDelete) => {
        if (willDelete) {
            app.apiCustomPost(apiController_data, "delete", callData , function(res){

                if(res.status=="success") {

                    swal(res.message, {
                        icon: "success",
                      });
                      _this.init();

                } else {

                    swal(errormessage, {
                        icon: "error"
                    });                     

                }
            }); 
        } else {
            swal(errormessage, {
                icon: "error"
            });             
        }
      });
},

请帮助我更正我的代码。

标签: javascriptjquerysweetalert

解决方案


我终于解决了这个问题。甜蜜警报的按钮属性有魔力。我们需要将 closeModal 值描述为 true 或 false 以关闭或不关闭模式。

现在按钮在加载时显示...

希望这可以帮助某人。

removeSession: function(sessionId){
    var _this = this;
    var errormessage = 'Error! Session not delete';
    var callData = {}
    callData["sessionId"] = 0;
    swal({
        title: "Are you sure?",
        text: "Once deleted, the session will be removed.",
        icon: "warning",
        buttons: {

              cancel: {
                text: "Cancel",
                value: false,
                visible: true,
                className: "",
                closeModal: true,
              },
              confirm: {
                text: "OK",
                value: true,
                visible: true,
                className: "",
                closeModal: false
              }

        },
        dangerMode: true,
      })
      .then((isConfirm) => {
        if (!isConfirm){ return false;}


            app.apiCustomPost(apiController_data, "delete", callData , function(res){

                if(res.status=="success") {

                        swal(res.message, {
                            icon: "success",
                          });

                          _this.init();

                } else {
                        swal(errormessage, {
                            icon: "error"
                        });                     

                }
            }); 

      });

},

推荐阅读