Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Sweet alert dialog with spinner in AngularJs

I am trying to display a spinner in a sweet alert dialog something close to Bootstrap modal dialog (http://jsfiddle.net/D6rD6/5/)

The closest i could come up with is something like this :

SweetAlert.swal({
title: '<small>Import errors occurred !</small>',
text: '<i class="fa fa-spinner" aria-hidden="true"></i>',
html: true,
customClass: 'manual-upload-errors-swal-width'
});

If this is not possible whats the closest and best solution ?

like image 443
hakuna Avatar asked Nov 01 '16 17:11

hakuna


People also ask

How do you confirm with sweet alert?

SweetAlert uses promises to keep track of how the user interacts with the alert. If the user clicks the confirm button, the promise resolves to true . If the alert is dismissed (by clicking outside of it), the promise resolves to null . swal("Click on either the button or outside the modal.")

What is sweet alert in angular?

In this article, we will learn how to use sweetalert2 in Angular 10 applications. Sweetalert2 is used to display alert messages. Prerequisites. Basic Knowledge of Angular 2 or higher. Visual Studio Code.


1 Answers

The original sweet alert plugin is unsupported, I suggest you using SweetAlert2 plugin.

Migration is simple, here's the migration guide: Migration from SweetAlert to SweetAlert2

In SweetAlert2 there's swal.showLoading(), so you can show loading modal as easy as:

Swal.fire('Please wait')
Swal.showLoading()
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
like image 104
Limon Monte Avatar answered Sep 19 '22 00:09

Limon Monte