Sweet Alert Timer - Feature Made

Question

I played a little with the SweetAlert: Sweet alert plugin

I wanted to make a delete button where the user will be prompted before the actual removal. When the user clicks “delete” again, he says “done,” and the user must click “OK” again so that the invitation disappears forever.

SweetAlert has a timer function, so you can automatically close the last Done prompt in a few seconds, which works great. They also have a function where you can implement a function that will run when the user clicks OK at the Finish prompt. The problem is that this function does not start if the prompt automatically closes after the timer ends.

Any ideas how to do this?

If the timer and function are not running:

swal({
     title: "Deleted!",
     text: "Your row has been deleted.",
     type: "success",
     timer: 3000
     },
     function () {
            location.reload(true);
            tr.hide();
     });

Without a timer, but with a working function (when you click "OK"):

swal("Deleted!", "Your row has been deleted.", "success"), function () {
                        location.reload();
                        tr.hide();
                    };

Answer 1

Explanation

, swal . , swal, , .

Javascript/JQuery:

swal({
     title: "Deleted!",
     text: "Your row has been deleted.",
     type: "success",
     timer: 3000
     });
     function () {
        location.reload(true);
        tr.hide();
     };

SweetAlert:

swal({
    title: "Are you sure?",
    text: "You will not be able to recover this imaginary file!",
    type: "warning",
    showCancelButton: true,
    confirmButtonColor: "#DD6B55",
    confirmButtonText: "Yes, delete it!",
    cancelButtonText: "No, cancel plx!",
    closeOnConfirm: false,
    closeOnCancel: false
    },
    function (isConfirm) {
        if (isConfirm) {
           swal({
              title: "Deleted!",
              text: "Your row has been deleted.",
              type: "success",
              timer: 3000
           });
           function () {
              location.reload(true);
              tr.hide();
           };
        }
        else {
            swal("Cancelled", "Your imaginary file is safe :)", "error");
        }
    });

Answer 2

.

sweetAlert, .
sweetalert, .

var sweetAlert = function(title, message, status, timer = 5000, isReload = false){
    swal({
        title   : title,
        text    : message + '<br/>This pop up will close automatically in <strong class="swal-timer-count">' + timer/1000 + '</strong> seconds...',
        type    : status,
        html    : true,
        timer   : timer,
        allowEscapeKey  : false
    }, function () {
        swal.close();
        if(isReload)
            location.reload(true);
    });
    var e = $(".sweet-alert").find(".swal-timer-count");
    var n = +e.text();
    setInterval(function(){
        n > 1 && e.text (--n);
    }, 1000);
}

,
, milisecond.

sweetAlert('Congratulation!', 'You successfully copy paste this code', 'success', 3000, false);

Answer 3

then?

.

swal({
    title: 'Login Success',
    text: 'Redirecting...',
    icon: 'success',
    timer: 2000,
    buttons: false,
})
.then(() => {
    dispatch(redirect('/'));
})

Answer 4

this problem is fixed with the new version of Sweetalert 2

https://limonte.imtqy.com/sweetalert2/

see plunker

Plunker

.

Answer 5

the solution is here.

[ https://sweetalert2.imtqy.com/]

See. Message with auto close timer

let timerInterval
Swal.fire({
  title: 'Auto close alert!',
  html: 'I will close in <strong></strong> milliseconds.',
  timer: 2000,
  onBeforeOpen: () => {
    Swal.showLoading()
    timerInterval = setInterval(() => {
      Swal.getContent().querySelector('strong')
        .textContent = Swal.getTimerLeft()
    }, 100)
  },
  onClose: () => {
    clearInterval(timerInterval)
  }
}).then((result) => {
  if (
    /* Read more about handling dismissals below */
    result.dismiss === Swal.DismissReason.timer
  ) {
    console.log('I was closed by the timer')
  }
})

My code

swal.fire({ type: 'success', title: 'Saved.', 
            showConfirmButton: false, timer: 1500 
}).then((result) => {
    if (result.dismiss === Swal.DismissReason.timer) {
         $("#new_reminder").modal("hide");                            
    }
});