10

Im trying to use SweetAlerts to confirm the deletion of a record. https://limonte.github.io/sweetalert2/

  1. Im extremely green when it comes to javascript/jquery.
  2. Everything works fine without the Alert. (button click -> Client Controller -> Helper -> Server Controller -> UI Updated after record deleted)

I have a button that calls a client side controller to display the alert. Then on confirmation, the helper method is called to delete the record.

deleteDoc: function(component, event, helper) {

    var docId = event.currentTarget.dataset.ctid;
    console.debug(">>> DocID: " + docId );
    swal({
        title: 'Are you sure?',
        text: "You won't be able to revert this!",
        type: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, delete it!'
    }).then(function() {

        helper.deleteDoc(component, docId );

    });
},

Then the helper:

deleteDoc: function(component, docId ) {

    var action = component.get("c.cDeleteDocument");

    action.setParams({
        docID: docId 
    });

    action.setCallback(this, function(response) {
        var state = response.getState();
        var wasDeleted = response.getReturnValue();
        console.debug("From server Return Value: " + response.getReturnValue());

        if (wasDeleted == true) {

        }

    });
    console.debug(">>> setCallback: ");
    $A.enqueueAction(action);
},

So, I confirm that I want to delete the file, and then the page just hangs. I can see the debug statements run in helper.deleteDoc, but the record still exists, so the Client Side controller has not actually run yet.

But if I click any other button in the page, or even just resize the window, then the Client side controller runs, and the setCallback debug statements show up.

What am I missing?


<< Solution - Small tweak to Caspars code >>

Thank you Casper! I just needed to add the parenthesis at the end.

$A.getCallback(function() {
    if (component.isValid()) {
        helper.deleteDoc(component, docId );
    }
})();

Alternatively, I could do this in the helper.

    $A.getCallback(function() {
        $A.enqueueAction(action);
    })();

But I went ahead and used Caspars suggestion though, in case I wanted to use the Helper function within Aura's normal rendering cycle.

2 Answers 2

10

I think this is happening because you are calling the method from outside Aura's normal rendering cycle -hence it works once you force something else to render. Try putting your callback inside this:

$A.getCallback(function() {
    if (component.isValid()) {
        helper.deleteDoc(component, docId );
    }
});
2
  • Thank you sir! I had used $A.getCallback before without really knowing why. This worked, and with some more reading, I have a better understanding.
    – ATA1k
    Apr 17, 2017 at 4:41
  • 1
    @ATA1k Good to know that your problem is solved!
    – javanoob
    Apr 17, 2017 at 6:07
4

This sorted it for me:

$A.getCallback(function() {
     $A.enqueueAction(action);
})();

Note the () on the end before the ;

1
  • 1
    I had an issue with a enqueued action (nothing fancy, just a controller action doing a query) not finishing until a random click on the page was done, and this fixed it for me!
    – Folkert
    Mar 5, 2019 at 8:51

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .