1

I've created a datatable for displaying account records along with view actio. When I'm clicking on view,dynamic component recordform should be called in a overlayLibrary using custom modals.

Below is the code, I'm getting error "This page has an error. You might just need to refresh it. First, would you give us some details? (We're reporting this as error ID: -2015273290)". Earlier I was getting error $A.getCallback[Component not defined]. I'm not sure where I went wrong.

As per my unit testing, code is working finr till alert('hi');

Controller:

public class Account_View_Controller {
      @AuraEnabled
    public static List<Account> invoke(){
        List<Account> accounts = [Select id,name,type from Account limit 5];
        return accounts;
    }
}

Component:

<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:appHostable" access="global" controller="Account_View_Controller" >
    <aura:attribute name="accounts" type="Object"/>
    <lightning:overlayLibrary aura:id="overlayLib"/>
    <aura:attribute name="columns" type="List" />
    <aura:handler name="init" value="{!this}" action="{!c.show}" />
    <div style="height :300px">
        <lightning:datatable aura:id="dtTable"
                             columns="{!v.columns}"
                             data="{!v.accounts}"
                             keyField="Id"
                             onrowaction="{!c.handleRowAction}" />
    </div>
</aura:component>

JS:

({
      show : function(component, event, helper) {
        var actions = [
                        {label : 'View', name:'View'}
                     ];
         component.set('v.columns',[
                    {label: 'Id', fieldName: 'Id', type: 'text'}, 
                     {label: 'name', fieldName: 'Name', type: 'text'},
                     {label: 'type', fieldName: 'Type', type: 'text'},
                    {type: 'action', typeAttributes:{rowActions: actions}}
                ]);
        var abc = component.get("c.invoke");
        abc.setCallback(this, function(response){
            var state=response.getState();
            if(state==='SUCCESS'){
                console.log('Success');

                var result = response.getReturnValue();
                component.set("v.accounts",result);
            }
        });
        $A.enqueueAction(abc);
      },
    handleRowAction: function (cmp, event, helper) {
        var action = event.getParam('action');
        var row = event.getParam('row');
        var recId =row.Id;    
        $A.createComponent(
                            "lightning:recordForm",
                            {
                                "recordId":recId,
                                "objectApiName":"Account",
                                "layoutType":"Full",
                                "mode":"edit"
                            },
                            function(myComp,status,statusMessage){  
                              alert('hi');
                                var body=myComp;
                                component.find("overlayLib").showCustomModal({
                                "header":"Application confirmation",
                                "body":body, 
                                "footer":"Lightning classes",
                                "showCloseButton":true,
                                "cssClass": "mymodal",
                                closeCallback: function(){
                                alert('You closed the alert');
                                }
                            })

                            }
                    );    
    }
}) 
0

Your issue is actually a very simple one to fix.

Notice how you are calling component.find("overlayLib").showCustomModal({

This is not defined, because you are passing the component reference as cmp.

Change handleRowAction: function (cmp, event, helper) { to

handleRowAction: function (component, event, helper) {

And it will work :)

1
  • Thanks a lot Caspar. You're genious !!
    – wink
    Mar 10 '20 at 4:00

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.