Question

40

SweetAlert Calling code after clicking Cancel button

rated 0 times [ 42] [ 2] / answers: 1 / hits: 48419 / 7 Years ago, thu, july 6, 2017, 12:00:00

I have written following code, I want to call a code under Cancel button:

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');

                }

            });

    });



}

but I cannot call cancel clicked. I was looking for in docs but cannot find the solution.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

aleighabayleef

Add To Favorites

Follow

Total Points: 511

Total Questions: 99

Total Answers: 99

Location: Aruba

Member since Fri, Jun 24, 2022

2 Years ago

answered 7 Years ago jenamackennac · Accepted Answer

You're passing too many parameters to the swal constructor. It needs only two:

swal(options, callback)

options: Attributes to design the alert

callback: The callback function to manage the events

When you use a simple confirm, the callback receive only one parameter that indicates the user choice:

true: Confirm

false: Cancel

With inputbox you will receive the user's input string as parameter.

When you merge together inputbox and confirm, you could receive:

the input string value: When the user press Confirm

false: When user press Cancel

So, you have to use the Strict Equality Comparison in order to know if user pressed cancel or have inserted the string false in the input box.

Please see the following simple example:

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);

  }

});

<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>

I hope it helps you, bye.