jQuery sweetAlert: un plugin per sostituire alert() JavaScript

Picture of Nello

Nello

jQuery sweetAlert un fantastico plugin per sostituire il classico alert() JavaScript

Inglobarlo nel nostro progetto è semplicissimo, basta scaricare il pacchetto da GitHub e includere il JS e il CSS.
Scarichiamo prima di tutto il codice dal Repository GitHub http://t4t5.github.io/sweetalert/, ora non ci resta che copiare sweetalert.min.js e sweetalert.css nel nostro progetto e richiamarli dalla nostra pagina HTML:

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

Installazione tramite bower:

bower install sweetalert

Installazione tramite NPM:

npm install sweetalert

Usare Sweetalert

Come usare il plugin Sweetalert? Semplicemente basta sostituire il classico

alert("Oops... Something went wrong!");

con

sweetAlert("Oops...", "Something went wrong!", "error");

penserà lui a creare il modale di alert o di confirmation!

E’ possibile usare anche una versione short: swal

Ecco un esempio per utilizzare Sweetalert come confirmation modal

swal({   
   title: "Are you sure?",   
   text: "You will not be able to recover this imaginary file!",   
   type: "warning",   
   showCancelButton: true,   
   confirmButtonColor: "#DD6B55",   
   confirmButtonText: "Yes, delete it!",   
   closeOnConfirm: false }, function(){   
      swal("Deleted!", "Your imaginary file has been deleted.", "success"); 
   });

Volete vedere il plugin in azione? Visitate la pagina ufficiale del plugin