-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-basic").on('click',function(){
   Swal.fire('Hello world, basic sweet alert.');
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-title").on('click',function(){
    Swal.fire(
    'The Internet?',
    'That thing is still around?',
    'question'
    );
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-error").on('click',function(){
    Swal.fire({
    icon: 'error',
    title: 'Whoops...',
    text: 'Something went wrong!',
    footer: 'Why do I have this issue?'
    });
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-success").on('click',function(){
    Swal.fire({
    icon: 'success',
    title: 'Welcome...',
    text: 'You have successfully registered with usLorem ipsum dolor sit amet, consectetur adipiscing elit.',
    footer: 'Contact us if any issue?'
    });
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-warning").on('click',function(){
    Swal.fire({
    icon: 'warning',
    title: 'Warning...',
    text: 'Your balance is low, pls recharge it',
    footer: 'Contact us if any issue?'
    });
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-custom").on('click',function(){
    Swal.fire({
    title: 'HTML example',
    icon: 'info',
    html:'You can use bold text, ' +
    'links ' +
    'and other HTML tags',
    showCloseButton: true,
    showCancelButton: true,
    focusConfirm: false,
    confirmButtonText: 'Great!',
    confirmButtonAriaLabel: 'Thumbs up, great!',
    cancelButtonText: 'Cancel',
    cancelButtonAriaLabel: 'Thumbs down'
    });
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-custom-position").on('click',function(){
    Swal.fire({
    position: 'top-end',
    icon: 'success',
    title: 'Your work has been saved',
    showConfirmButton: false,
    timer: 1500
    });
});
 

-- HTML
<link href="asset/plugin/sweetalert/css/sweetalert2.css" rel="stylesheet">
<script src="asset/plugin/sweetalert/js/sweetalert2.all.min.js"></script>

-- JS
$("#btn-sa-confirm").on('click',function(){
    Swal.fire({
    title: 'Are you sure?',
    text: "You won't be able to revert this!",
    icon: 'warning',
    showCancelButton: true,
    confirmButtonColor: '#1ab394',
    cancelButtonColor: '#d9534f',
    confirmButtonText: 'Yes, delete it!'
    }).then((result) => {
        if (result.isConfirmed) {
            Swal.fire(
            'Deleted!',
            'Your file has been deleted.',
            'success'
            )
        }
    });
});