sweetAlert - not calling function on confirm button click

Question

I added following alert by following this but no functions are getting called when I click cancel or confirm buttons, am I doing something wrong? My master page has link to css: <link href="css/plugins/sweetalert/sweetalert.css" rel="stylesheet" />

            sweetAlert({
                html: true,
                title: 'Error',
                text: "test",
                type: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Check',            
            }).then((result) => {
                if (result.value) {
                    sweetAlert("Yes", "Blah", "info");
                } else {                   
                    sweetAlert("No", "Blah", "info");
                }
                });

Answer 1

If you're using jQuery, attach click event on DOM element where you want to call action, and fire SweetAlert popup. Use SweetAlert or sweetAlert instances to trigger (fire) event.

Here is example that will help you start with:

$(function() {
  const events = {
    click: 'click'
  };
  
  const $button = $('#somethingToDo');
  
  $button.on(events.click, function(event) {
    const config = {
      html: true,
      title: 'Error',
      text: 'test',
      type: 'warning',
      showCancelButton: true,
      confirmButtonText: 'Check',    
    };
    
    // first variant
    sweetAlert.fire(config).then(callback);
    
    function callback(result) {
      if (result.value) {
        // second variant 
        SweetAlert.fire("Yes", "Blah", "info");
      } else {
        // second variant 
        SweetAlert.fire("No", "Blah", "info");
      }
    }
  });
})

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.all.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button id="somethingToDo">
  Do something
</button>