2

ポップアップを表示するために、SweetAlert2 JavaScript ライブラリを使用しています。SweetAlert2 は、もうメンテナンスされていない SweetAlert のフォークです。SweetAlert2 では、このようなラジオ ボタンを追加できます

// inputOptions can be an object or Promise
var inputOptions = new Promise(function(resolve) {
    resolve({
      '#ff0000': 'Red',
      '#00ff00': 'Green',
      '#0000ff': 'Blue'
    });
});

swal({
  title: 'Select color',
  input: 'radio',
  inputOptions: inputOptions,
  inputValidator: function(result) {
    return new Promise(function(resolve, reject) {
      if (result) {
        resolve();
      } else {
        reject('You need to select something!');
      }
    });
  }
}).then(function(result) {
  swal({
    type: 'success',
    html: 'You selected: ' + result
  });
})

SweetAlert2 は、次のように、ラジオ入力に「swal2-radio」という名前を付けます。

<input id="swal2-radio-1" type="radio" name="swal2-radio" value="3">

そのため、次のようなクリックを sval2-radio でリッスンしようとします。

$("input[name='swal2-radio']").on("click", function() {
var id = $('input[name=swal2-radio]:checked').val();
console.log('id: ' + id);
});

コンソールに出力して、機能したことを確認する必要があります。

これまでのコードは次のとおりです: https://jsfiddle.net/ayx0fkz3/

何か間違ったことをしているのですか、それとも SweetAlert2 の仕組みが原因でこれが機能していないのですか?

4

1 に答える 1