Trigger a function after a response to sweet alert 2

Question

I have been stuck on this for a few days now. I am using sweetalert2 and what I am trying to accomplish is to trigger a javascript function based on the answer given, so if I click OK it triggers one thing and if I click cancel it does something else. I can sorta get it to work but it appears to trigger the function before sweet alert completes. Here is a sample of the code :

<script>
    function validateSubmit(a,b,c){
        var mode = a;
        var info = b;
        var trunk = c;

        var iteration = baseName(info);

        if (mode === 'Update' && info != trunk ){
            confirmGetMessage(iteration);
        }
        else {
            alert('seems to work')
        }
    }

    function baseName(str) {
        var base = new String(str).substring(str.lastIndexOf('/') + 1); 
        if(base.lastIndexOf(".") != -1)       
        base = base.substring(0, base.lastIndexOf("."));
        return base;
    }

    function trythis(){
        alert('made it right here!');
    }

    function confirmGetMessage(info){
        var message = "<h3>" + info + "</h3><br/>Or Revert Back to Trunk?";             var contmessage = "Updating " + info;

        swal({
            title: "Update Branch?",
            html: message,
            type: "question",
            showCancelButton: true,
            cancelButtonText: "Switch To Trunk",
            cancelButtonColor: "#0080FF",
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "Continue Update",
            closeOnConfirm: false,
            closeOnCancel: false
        }).then(
            function(result){
                swal({
                    text: contmessage,
                    timer: 1400,
                    showConfirmButton: false
                }), alert('work please');
            }, function(dismiss) {
                swal({
                    text: 'Switching to Trunk',
                    timer: 1400,
                    showConfirmButton: false
                });
            }
        );
    }
</script>

So if you run this code the alert box pops up over the message box from sweetalert.

---------- UPDATE ---------------

Running the code like so seems to be getting closer although now the alert message still happens before the closing message but at least this time I can see the closing message

    function validateSubmit(a,b,c){
            var mode = a;
            var info = b;
            var trunk = c;

            var iteration = baseName(info);

            if (mode === 'Update' && info != trunk ){
                confirmGetMessage(iteration);
            }
            else {
                alert('seems to work')
            }
        }

        function baseName(str) {
            var base = new String(str).substring(str.lastIndexOf('/') + 1); 
            if(base.lastIndexOf(".") != -1)       
            base = base.substring(0, base.lastIndexOf("."));
            return base;
        }

        function trythis(){
            alert('made it right here!');
        }

        function confirmGetMessage(info){
            var message = "<h3>" + info + "</h3><br/>Or Revert Back to Trunk?";
            var contmessage = "Updating " + info;

            swal({
                title: "Update Branch?",
                html: message,
                type: "question",
                showCancelButton: true,
                cancelButtonText: "Switch To Trunk",
                cancelButtonColor: "#0080FF",
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "Continue Update",
                closeOnConfirm: false,
                closeOnCancel: false
            }).then(function(){
                swal({
                    text: contmessage,
                    timer: 1400,
                    showConfirmButton: false
                },trythis())
            }, function(dismiss){
                if (dismiss === 'cancel'){
                    swal({
                        text: 'Switching to Trunk',
                        timer: 1400,
                        showConfirmButton: false
                    })
                }
            }
        )}

score 1 · Answer 1 · answered Nov 03 '16 at 21:01

You're reading the value into result in the first function call after creating the alert, but you're not checking the value of the call.
From Sweet alert timer - done function,

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!",
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
},
function (isConfirm) {
    if (isConfirm) {
       swal({
          title: "Deleted!",
          text: "Your row has been deleted.",
          type: "success",
          timer: 3000
       });
       function () {
          location.reload(true);
          tr.hide();
       };
    }
    else {
        swal("Cancelled", "Your imaginary file is safe :)", "error");
    }
});

You need to check whether the input was a confirm or not. Something like this is probably what you want, but I don't have an environment to test it with:

swal({
        title: "Update Branch?",
        html: message,
        type: "question",
        showCancelButton: true,
        cancelButtonText: "Switch To Trunk",
        cancelButtonColor: "#0080FF",
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "Continue Update",
        closeOnConfirm: false,
        closeOnCancel: false
    },
    function(result){
        if(result)
        {
            swal({
                text: contmessage,
                timer: 1400,
                showConfirmButton: false
            }), alert('work please');
        },      
        else{
            swal({
                text: 'Switching to Trunk',
                timer: 1400,
                showConfirmButton: false
            });
        }
    }
);

Trigger a function after a response to sweet alert 2

1 Answers1