Richard Cook remarked above that the original answer (provided by Konstantin Azizov) stopped working with version 4.2.6 of SweetAlert2. He suggested this had to do with nodes being cloned as they are added to the html. I don't know SweetAlert2 well enough to say whether he was right or not. I could see, though, that my buttons got added but the onclick callback functions never got called.
With a little effort, I was able to get this to work with the current release of SweetAlert2. To make it work I had to assign the onclick events to the buttons at a later point. I ended up adding ids to the buttons, making them easy to select from jQuery. Then I added on onOpen function to my swal object and in there, connected the logic to associate the callback functions. Below is a snippet of the code that works for me.
Also note that the message and buttons use some existing SweetAlert2 classes so they do have the same look as the existing UI elements. A word of caution, I did try using the swal2-confirm and swal2-cancel classes. When I did that I ran into some issues. It may be that SweetAlert2 code is dependent on there only being a single element that uses that class. I didn't have time to chase it down so I just stopped using those classes.
function createButton(text, id) {
return $('<button class="swal2-input swal2-styled" id="'+id+'">'+text+'</button>');
}
function createMessage(text) {
return $('<div class="swal2-content" style="display: block;">'+text+'</div>');
}
function swThreeButton(msg, textOne, textTwo, textThree, callbackOne, callbackTwo, callbackThree) {
var buttonsPlus = $('<div>')
.append(createMessage(msg))
.append(createButton(textOne,'sw_butt1'))
.append(createButton(textTwo,'sw_butt2'))
.append(createButton(textThree,'sw_butt3'));
swal({
title: 'Select Option',
html: buttonsPlus,
type: 'question',
showCancelButton: false,
showConfirmButton: false,
animation: false,
customClass: "animated zoomIn",
onOpen: function (dObj) {
$('#sw_butt1').on('click',function () {
swal.close();
callbackOne();
});
$('#sw_butt2').on('click',function () {
swal.close();
callbackTwo();
});
$('#sw_butt3').on('click',function () {
swal.close();
callbackThree();
});
}
});
};
