CODEWITHSUNDEEP
javascripthtml
Error19
Error19

Reputation: 93

SweetAlert2 not working and stopped in IE11

<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/style_index.css">
        <script src="js/testjs.js" charset="utf-8"></script>
        <script src="js/sweetalert2.all.min.js"></script>
    </head>

    ...

    <body>
        <div class="search">
            <input type="text" id="search" name="search" required>
            <button name="button" onclick="swal('Hi!')">Search1</button>
            <button name="button2" onclick="alert('hi2')">Search2</button>
        </div>

    ...

this is my code.

Search2 button works well, but Search1 button doesn't. When I click this button, page has a lack and not work in IE11. but in chrome it has no problem... I can't figure out why it does... plz help me.

Upvotes: 0

Views: 584

Answers (1)

Junior Dussouillez
Junior Dussouillez

Reputation: 2397

Sweetalert2 uses Promises but promises are not implemented by IE11. You have to include a polyfill (it's written in the docs). If you don't include the polyfill, you will have an error in the developer console logs (F12) "Promise" is undefined.

<html>
    <head>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.26.12/sweetalert2.all.min.js"></script>
        <!-- Include a polyfill for ES6 Promises -->
        <script src="https://cdn.jsdelivr.net/npm/promise-polyfill"></script>
    </head>
    <body>
        <div class="search">
              <input type="text" id="search" name="search" required>
              <button name="button" onclick="swal('Hi!')">Search1</button>
              <button name="button2" onclick="alert('hi2')">Search2</button>
        </div>
    </body>
</html>

Upvotes: 2

Related Questions