0

I'm trying to display pop up window by clicking the buttons from button menu.I have two buttons like EDIT/DELETE.

If I click the edit need to display pop up window with record fields.

If I click the delete button need to ask for before the record is deleting.

The below code isn't working please check it once and suggest some ideas

Component's markup:

<aura:component implements="force:appHostable,
                            flexipage:availableForAllPageTypes,
                            flexipage:availableForRecordHome,
                            force:hasRecordId,
                            force:lightningQuickAction"
                access="global" >
    <aura:attribute name="titleMessage" type="String" default="Information" />
    <aura:attribute name="bodyMessage" type="String" default="We have created a generic model component!!" />
    <aura:attribute name="footerButtonDisplay" type="boolean" default="false" />
    <aura:attribute name="bodyComponent" type="String" default="c:LightningModelComp" />
    <aura:attribute name="FooterComponent" type="String" default="c:LightningModelFooterComp" />

    <div class="slds-form-element">
            <lightning:buttonMenu aura:id="overlayLib" alternativeText="Show menu" onselect="{!c.handleMenuSelect}">
            <lightning:menuItem label="Edit"   iconName="utility:edit"   value="edit"/>
            <lightning:menuItem label="Delete" iconName="utility:delete" value="delete"/>
            </lightning:buttonMenu>
    </div>
</aura:component>

JS controller:

handleMenuSelect: function(component, event, helper) {

    var selectedMenu = event.detail.menuItem.get("v.value");
    console.log('selectedMenu-' + selectedMenu);
    switch(selectedMenu) {
        case "edit":
            var modalBody;
            var modalFooter;
            $A.createComponents(
                [
                    [component.get("v.bodyComponent"), { messageBody: component.get("v.bodyMessage"), }],
                    [component.get("v.FooterComponent"), {}]
                ],
                function (components, status) {
                    if (status === "SUCCESS") {  
                        modalBody = components[0];
                        modalFooter = components[1];
                        component.find('overlayLib').showCustomModal({
                            header: component.get("v.titleMessage"),
                            body: modalBody,
                            footer: modalFooter,
                            showCloseButton: true,
                            cssClass: "my-modal",
                            closeCallback: function () {
                                alert('You closed the alert!');
                            }
                        })
                    }
                }
            );
        break;

        case "delete":
            //do delete
            break;
    }
},
0

You should use salesforce force:editRecord to edit the record, It open default edit action in a popup.

  • For Delete part, you should call the apex method to delete the record
switch(selectedMenu){
    case 'edit' :
        var editRecordEvent = $A.get("e.force:editRecord");
        editRecordEvent.setParams({
             "recordId": component.get("v.contact.Id")
       });
        editRecordEvent.fire();

    case 'delete':
    //ToDo : show confirmation message on screen.
    //After that call apex to delete the recordId
}

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.