Sweetalert: De nombreux boutons combinés à une entrée ne renvoient que la valeur du bouton

Voulez-vous dire que vous voulez que le bouton de confirmation et un autre bouton renvoient la valeur de l'entrée ? Pourrais-tu préciser quel est ton cas d'utilisation exactement ? :)

@ t4t5 cela a probablement à voir avec ce FIXME.

swal({
    buttons: {
        cancel: "Go back!",
        one: {
          text: "Button One",
          value: 1
        },
        two: {
          text: "Button Two",
          value: 2
        },
        three: {
          text: "Button Three",
          value: 3
        }
      },
      content: {
        element: "input",
        attributes: {
          placeholder: "What's your favorite food?",
          type: "text",
        },
      }
/*
 * Only returns one value, because input is overridden by buttons
 * so you never get the input's value and the button's value
 * just the button's value.
 */
}).then( value => {
    switch (value) {                  
        case 1:
            swal("You pressed one!")
            break;
        case 2:
            swal("You pressed two!")
            break;
        case 3:
            swal("You pressed three!")
            break;
        default:
            swal("Phew, got outta there.");
    }
});

Il serait très utile d'avoir la possibilité d'utiliser la valeur du bouton ainsi que la valeur d'entrée pour exécuter une logique au lieu d'imbriquer des alertes et d'avoir une entrée inutile car elle est remplacée par vos boutons.

+1 pour avoir à la fois une button et une valeur content

Si vous réglez l'une des touches du bouton sur « confirmer », il renverra la valeur de l'entrée. par exemple:

swal({
  buttons: {
    cancel: "Go back!",
    one: {
      text: "Button One",
      value: 1
    },
    two: {
      text: "Button Two",
      value: 2
    },
    confirm: {
      text: "Button Three",
    }
  },
  content: {
    element: "input",
    attributes: {
      placeholder: "What's your favorite food?",
      type: "text",
    },
  }
})

Est-ce suffisant pour votre cas d'utilisation, ou voulez-vous dire que chaque bouton doit renvoyer à la fois la valeur d'entrée et la valeur du bouton ?

@t4t5 Chaque bouton doit renvoyer la valeur d'entrée et la valeur du bouton. Spécifiquement pour mon cas d'utilisation, j'utilise SweetAlert pour un outil d'administration de serveur basé sur le Web et plus spécifiquement pour inviter l'administrateur lorsqu'il clique sur le bouton "ban" d'un utilisateur. L'alerte aurait alors trois boutons dont j'ai besoin pour renvoyer une valeur de ("1d", "1w" ou "forever") pour représenter une durée. J'ai également besoin d'un champ de saisie de texte pour expliquer pourquoi un utilisateur est banni. En cliquant sur l'un de ces boutons, cela permettrait à mon rappel d'associer la valeur du bouton sur laquelle vous avez cliqué avec la valeur d'entrée pour créer une requête API vers mon serveur afin de placer une interdiction avec une raison et combien de temps l'interdiction devrait durer.

Espérons que ce cas d'utilisation devrait clarifier l'importance de renvoyer les deux valeurs. Cela permet aux développeurs de ne pas avoir à pirater les choses ou à créer deux alertes pour accomplir ce qui devrait être un processus en une seule étape.

        banPlayer: function (data) {
            var swalField = document.createElement('input');
            swalField.setAttribute("placeholder", "Reason for ban");
            swal({
                title: 'Banning: ' + data.name,
                buttons: {
                    cancel: "Go back!",
                    day: {
                      text: "24hr",
                      visible: true,
                      closeModal: true
                    },
                    week: {
                      text: "1w",
                      visible: true,
                      closeModal: true
                    },
                    perm: {
                      text: "Forever",
                      visible: true,
                      closeModal: true
                    }
                  },
                  content: swalField,
                dangerMode: true
            }).then( value => {
                let reason = swalField.value;
                // build API query request and submit it
            });

L'extrait ci-dessus est ma façon "hacky" d'obtenir le contenu et les valeurs des boutons. Cependant, comme indiqué précédemment dans ce fil, il serait beaucoup plus agréable de simplement renvoyer les deux valeurs.

Un autre exemple serait un modal ( closeOnEsc: false, closeOnClickOutside: false ) avec un champ d'entrée et deux boutons : confirmer + annuler. Je vais utiliser la solution @JayHerlth pour le moment. Ce serait mieux si le paramètre value est un objet si {buttons & content } est défini.