7

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.

7

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 );
    }
});
| improve this answer | |
  • 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 '17 at 4:41
  • 1
    @ATA1k Good to know that your problem is solved! – javanoob Apr 17 '17 at 6:07
3

This sorted it for me:

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

Note the () on the end before the ;

| improve this answer | |
  • 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 '19 at 8:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.