javascriptalertifyjs

Alert confirmation issue


I have a button on which when the user clicks to delete project on the site a confirmation pops up , I am using alertify.js for this I have the button etc working however when clicking delete the confirmation box appears and automatically deletes project and vanishes before I can either click ok to confirm or cancel.. ?

here is the html

<button type="submit" class="btn btn-link btn-sm" Onclick="return ConfirmDelete();" style="margin:5px;"></button>

here is javascript code

 function ConfirmDelete()
{
   alertify.confirm("This is a confirm dialog", function (ev) {
        ev.preventDefault();
        alertify.success("You've clicked OK");
    }, function(ev) {
        ev.preventDefault();
        alertify.error("You've clicked Cancel");
    });
}

how can I prevent this from happening ?


Solution

  • You can't prevent form submission in this case because custom confirmation is non-blocking asynchronous dialog. You can stop it however by always returning false and submitting form manually (programmatically) in case of Ok button press:

    function ConfirmDelete(button) {
      alertify.confirm("This is a confirm dialog", function() {
        button.form.submit()
        // alertify.success("You've clicked OK", function() {
        //   button.form.submit()
        // });
      }, function() {
        alertify.error("You've clicked Cancel");
      });
    
      return false;
    }
    

    For this make sure to pass button reference to your function:

    <button type="submit" onclick="return ConfirmDelete(this)">ConfirmDelete</button>