Sweetalert does not work but when i test with alert it does

Question

I recently started using Sweetalert but now I don't understand why it doesn't work.

I made a function that retrieves the value of a button that I tested with alert (and it works) but as soon as I put it with sweetalert, the button is validated directly without the sweetalert being displayed.

function dosomething(val) {
  if (val === "Warning") {
    swal({
      html: 'Warning !!!',
      icon: 'warning',
      confirmButtonColor: '#0A717D',
      confirmButtonText: 'Ok',
    });
  }
};

<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<link rel="stylesheet" href="src/js/jquery-ui.min.css">
<button type="submit" name="besoin" onclick="dosomething(this.value)" value="Warning">Do something</button>

I made you a snippet. It gives errors in the console. You are missing a TITLE — mplungjan, Jan 29 '21 at 09:30
Voting to close as _Not reproducible or was caused by a typo or some simple issue. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers._ — mplungjan, Jan 29 '21 at 09:34

vagored61 · Answer 1 · 2021-01-29T10:19:27.087

    openAreYouSureDialogDocument(training): void {
     if('warning'){
        Swal.fire({
                    title: 'Warning !!!',
                    text: 'Warning !!!',
                    icon: 'warning',
                    confirmButtonColor: '#0A717D',
                    confirmButtonText: 'Ok',
        }).then((result) => {
          if (result.value) {
           //  if all good 
          }
        }).catch(err => console.log(err))
}
      }

John Doe · Accepted Answer · 2021-01-29T10:06:19.173

The title attribute was missing from your sweet alert function.

<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<link rel="stylesheet" href="src/js/jquery-ui.min.css">
<script>
function dosomething(val)
{
    if (val === "Warning") 
    {
        swal({
            title: 'Warning !!!',
            html: 'Warning !!!',
            icon: 'warning',
            confirmButtonColor: '#0A717D',
            confirmButtonText: 'Ok',
        });
    }
};
</script>
<button type="submit" name="besoin" onclick="dosomething(this.value)" value="Warning">Warning</button>

Sweetalert does not work but when i test with alert it does

2 Answers2