CODEWITHSUNDEEP
javascriptsweetalert
brazorf
brazorf

Reputation: 1951

Javascript SweetAlert not working?

This html document

<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
</head>

<script>
    SweetAlert('a', 'b', 'c');
</script>

is not working. I get Uncaught ReferenceError: SweetAlert is not defined

If i use swal() instead of SweetAlert() i get

Uncaught TypeError: Cannot read property 'className' of null

The same test with sweetalert2

<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/6.6.5/sweetalert2.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/6.6.5/sweetalert2.common.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/6.6.5/sweetalert2.min.js"></script>
</head>

i get the following

Uncaught ReferenceError: module is not defined
    at sweetalert2.common.min.js:1

sweetalert2.min.js:1 Uncaught TypeError: Cannot read property 'querySelector' of null
    at u (sweetalert2.min.js:1)
    at c (sweetalert2.min.js:1)
    at U (sweetalert2.min.js:1)
    at e (sweetalert2.min.js:1)
    at test:8

Upvotes: 5

Views: 70156

Answers (4)

Weedoze
Weedoze

Reputation: 13943

Error A

You were calling SweetAlert(...) instead of sweetAlert(...). First letter should be in lower case.

Error B

If you are using the third argument, it should be warning, error, success or info

sweetAlert("title", "description", "error");
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>

Upvotes: 10

Pankaj
Pankaj

Reputation: 169

Type must be in small case like warning, error, success or info.

Upvotes: 0

JAGAT DAS
JAGAT DAS

Reputation: 29

//Define.

    <script src="js/sweetalert.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/sweetalert.css">

//For Call

    function callSweetMsg(){
        swal({
        title: "Error!",``
        text: "Here's my error message!",
        type: "error",
        confirmButtonText: "Cool"
       });
    }

Upvotes: 2

Ali
Ali

Reputation: 1383

You don't need a name like sweetAlert. You can use swal('Title', 'Message', 'type') instead of sweetAlert

swal("HEY", "Message", "warning")
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>

Upvotes: 4

Related Questions