web-dev-qa-db-fra.com

Code d'appel SweetAlert après avoir cliqué sur le bouton "Annuler"

J'ai écrit le code suivant, je veux appeler un code sous le bouton "Annuler":

vm.saveGroup = function(){
    SweetAlert.swal({
        title: "Name this Device Group",
        text: "Please provide a name that you want your device group to be saved under. Also, make sure that you already specified all needed filters before you save the list.",
        type: "input",
        showCancelButton: true,
        closeOnConfirm: false,
        showLoaderOnConfirm: true,
        inputPlaceholder: "Device Group name"
    },
    function(inputValue){
        if (inputValue === false) {
            return false;
        }
        if (inputValue === "") {
            /*eslint-disable */
            swal.showInputError("You need to write something!");
            /*eslint-enable */
            return false;
        }

        deviceGroupsFactory.saveGroup(inputValue, vm.filterOutput)
            .then(function(response){
                if (response.status == 200){
                    SweetAlert.swal("Device Group saved!", "You should now see your device group on the list.", "success");
                    $state.go('main.template.devices.groups');
                }
                else {

                    SweetAlert.swal("Error!", response.statusText, "error");

                  console.log('xxx');
                }
            });
    });

}

mais je ne peux pas appeler "annuler cliqué". Je cherchais dans la documentation mais je ne trouve pas la solution. 

javascriptangularjssweetalert
4
Tomasz Waszczyk

Vous transmettez trop de paramètres au constructeur swal. Il suffit de deux:

swal (options, rappel)

  • options: Attributs pour concevoir l'alerte
  • callback: la fonction de rappel pour gérer les événements

Lorsque vous utilisez une confirmation simple, le rappel ne reçoit qu'un paramètre indiquant le choix de l'utilisateur:

  • true: confirmer
  • false: Annuler

Avec inputbox, vous recevrez la chaîne de saisie de l'utilisateur en tant que paramètre.

Lorsque vous fusionnez ensemble inputbox et confirmez, vous pouvez recevoir:

  • la valeur de la chaîne d'entrée: lorsque l'utilisateur appuie sur Valider
  • false: lorsque l'utilisateur appuie sur Annuler 

Donc, vous devez utiliser Strict Equality Comparison pour savoir si l'utilisateur a appuyé sur Cancel ou si vous avez inséré la chaîne false dans la zone de saisie.

Veuillez voir l'exemple simple suivant:

swal({
  title: "Are you sure?",
  text: "Press CANCEL, please!",
  type: "input",
  showCancelButton: true,
  confirmButtonColor: "#DD6B55",
  confirmButtonText: "CONFIRM",
  cancelButtonText: "CANCEL",
  closeOnConfirm: false,
  closeOnCancel: false
},
function(inputValue){
  //Use the "Strict Equality Comparison" to accept the user's input "false" as string)
  if (inputValue===false) {
    swal("Well done!");
    console.log("Do here everything you want");
  } else {
    swal("Oh no...","press CANCEL please!");
    console.log("The user says: ", inputValue);
  }
},
function(inputValue){
  if (inputValue === false) return false;
  
  if (inputValue === "") {
    swal.showInputError("You need to write something!");
    return false
  }
  
  swal("Nice!", "You wrote: " + inputValue, "success");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert-dev.min.js"></script>

J'espère que cela vous aide, au revoir.

4
Alessandro

vous pouvez également utiliser la mise en œuvre de promesses en utilisant .then

Je vous laisse un exemple, cela serait exécuté juste après avoir appuyé sur le bouton

swal( 'Error!',valido.msj,'error').then((e)=>{
  if( valido.msj=="Enlace de botón No Válido" ){
     document.getElementById('link_btn_barra').focus();
  } 
});
0
Julio Vinachi