Sweet Alert 2 Not working for delete and cancel both showing same action.

[saiketjaman]

Prerequisites

Please answer the following questions for yourself before submitting an issue.

• [ yes] I am running the latest version
• [ yes] I checked the documentation and found no answer
• [ yes] I checked to make sure that this issue has not already been filed
• [yes ] I'm reporting the issue to the correct repository (for multi-repository projects)

Expected Behavior

supposes to dismiss after clicking the cancel button in the sweet alert 2 click try me.

Current Behavior

What is the current behavior? but it's showing the same action with delete alert. plz, check the link below. https://demos.creative-tim.com/material-dashboard-pro/examples/components/sweet-alert.html

Failure Information (for bugs)

Please help provide information about the failure if this is a bug. If it is not a bug, please remove the rest of this template.

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

1. step 1
2. step 2
3. you get it...

Context

Please provide any relevant information about your setup. This is important in case the issue is not reproducible except for under certain conditions.

• Device:
• Operating System:
• Browser and Version:

Failure Logs

Please include any relevant log snippets or files here.

[groovemen]

Hello @saiketjaman,

Thank you for using our products, we find a solution for this issue: please replace the else if function from assets/demo/demo.js file from line 750 to 784 with the function below.

else if (type == 'warning-message-and-cancel') {
      Swal({
        title: 'Are you sure?',
        text: 'You will not be able to recover this imaginary file!',
        type: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes, delete it!',
        cancelButtonText: 'No, keep it',
        confirmButtonClass: "btn btn-success",
        cancelButtonClass: "btn btn-danger",
        buttonsStyling: false
      }).then((result) => {
        if (result.value) {
          Swal({
            title: 'Deleted!',
            text: 'Your imaginary file has been deleted.',
            type: 'success',
            confirmButtonClass: "btn btn-success",
            buttonsStyling: false
          })
        }
      },function(dismiss) {
        // dismiss can be 'overlay', 'cancel', 'close', 'esc', 'timer'
        if (dismiss === 'cancel') {
          swal({
            title: 'Cancelled',
            text: 'Your imaginary file is safe :)',
            type: 'error',
            confirmButtonClass: "btn btn-info",
            buttonsStyling: false
          }).catch(swal.noop)
        }
      }
    )
  }

Hope that information helps you. Please let us know if we can help you with anything else.

All the best, Stefan

[swaffoja]

For those looking for more info... there was a breaking change in SweetAlert2 v7 that changed the way dismiss actions are handled. The new recommended way to handle dismissals in SweetAlert2 v7 is:

swal({
  ...
}).then(result => {
  if (result.value) {
    // handle confirm
    console.log(result.value)
  } else {
    // handle dismiss, result.dismiss can be 'cancel', 'overlay', 'close', and 'timer'
    console.log(result.dismiss)
  }
})

You may need to change some of your swal() calls if you are migrating from Material Dashboard Pro (Bootstrap 3) to Material Dashboard Pro (Bootstrap 4).

@groovemen This issue appears in a few of your demos. MDP Laravel & Bootstrap 4 at least. I didn't check the other flavors.