0

Creating a lightning component and I have two methods in the helper class which a) dynamically create two lightning components (buttons) and a modal popup and b) a method for the onclick of one of these buttons which closes the window.

The modal window is rendering correctly with the buttons as intended, but the "handleCancel" method is firing on modal load, NOT on the "onclick" of the button. Code is below, any suggestions are appreciated.

handleShowModal: function(component, evt, helper) {
    $A.createComponents(
        [
            ["lightning:button",
            {
                "aura:id": "cancelButton",
                "label": "Cancel",
                "onclick": helper.handleCancel(component)               
            }],
            ["lightning:button",
            {
                "aura:id": "mergeButton",
                "label": "Merge"
            }]
        ],
        function(comp, status) {
            if (status === "SUCCESS") {
                component.find('overlayLib').showCustomModal({
                    header: "Confirm Merge",
                    body: "Are you sure you wish to merge the below records?", 
                    footer: comp,
                    showCloseButton: true
                });
            }
        }
    );
},
//closes the modal
handleCancel : function(component) {
    console.log("button pressed");  
    console.log("the comp "+component.find("overlayLib"));
    component.find('overlayLib').notifyClose();
}
2
handleShowModal: function(component, evt, helper) {
    $A.createComponents(
        [
            ["lightning:button",
            {
                "aura:id": "cancelButton",
                "label": "Cancel",
                "onclick": cmp.getReference("c.handleCancel")               
            }],
            ["lightning:button",
            {
                "aura:id": "mergeButton",
                "label": "Merge"
            }]
        ],
        function(comp, status) {
            if (status === "SUCCESS") {
                component.find('overlayLib').showCustomModal({
                    header: "Confirm Merge",
                    body: "Are you sure you wish to merge the below records?", 
                    footer: comp,
                    showCloseButton: true
                });
            }
        }
    );
}

Your handle cancel should be a function of js Controller.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/js_cb_dynamic_cmp_async.htm

  • Thanks @Manjot that worked in that the handleCancel method will successfully be called on click of the button (I can see console logs in the browser). However, the actual closing of the modal isn't working. Is this the right method to do so? component.find("overlayLib").notifyClose(); – George Albrecht Dec 14 '17 at 21:22
  • I actually found this link here: salesforce.stackexchange.com/questions/193770/… which provides a valid solution. It appears the notifyClose has some problems. I'll mark your answer as best answer it was correct for my need but this other item should be referenced as well for others. – George Albrecht Dec 14 '17 at 21:52

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.