0

I have a requirement, where I have to open a DataTable in the Model window after click into 'Select Template' Button. When Button clicked, all Templates records gets populated into Datatable, now when you select the any DataTable row, the same row I am trying to capture in onrowfunction. But I am not able to capture it and getting the below error while Selecting Row. Can someone please guide me what wrong I am doing in my code below.

DataTable in Model enter image description here

Below is my Component Code:

<aura:component controller='MessageCreationFromCaseController' implements='force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction' access='global'>
<aura:attribute name="msgId" type="String" />
<aura:attribute name="msgValue" type="String" />
<aura:attribute name="signValue" type="String" />
<aura:attribute name="attachList" type="String[]" />
<aura:attribute name="isOpen" type="boolean" default="false"/>
<aura:attribute type="Viesti_pohja__c[]" name="tempList"/>
<aura:attribute name="tempcolumns" type="List"/>
<aura:handler name="init" value="{! this }" action="{!c.doInit}"/>
<lightning:inputRichText value="{!v.msgValue}"/>
<!--<br/><lightning:fileUpload label="Attach receipt"
    name="fileUploader"
    multiple="true"
    accept="{!v.filetype}"
    recordId="{!v.recordId}"
    onuploadfinished="{!c.handleUploadFinished}" />-->

<aura:if isTrue="{!v.isOpen}">
    <section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open">
        <div class="slds-modal__container">
            <header class="slds-modal__header">
                <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">Choose Message from Templates</h2>
            </header>
            <div style="height: 300px">
                <lightning:datatable data="{! v.tempList}" 
                     columns="{! v.tempcolumns}" 
                     keyField="id"
                     hideCheckboxColumn="true"
                     enableInfiniteLoading="true"
                     onloadmore="{! c.loadMoreData}"
                     onrowaction="{!c.handleClick}"/>   
            </div>
            <footer class="slds-modal__footer">
                <lightning:button variant="neutral" 
                                  label="Cancel"
                                  title="Cancel"
                                  onclick="{! c.closeModel }"
                                  />
            </footer>
        </div>
    </section>
    <div class="slds-backdrop slds-backdrop_open"></div>
    
</aura:if>
<br/><lightning:button variant="brand" label="Create Message" title="Create Message" onclick="{!c.createMessage}" /> 
<lightning:button class="slds-m-right_small" variant="brand" label="Select Template" title="Choose Message from Template" onclick="{!c.openModel}" />

</aura:component>

({
doInit : function(component, event, helper) {
    helper.fetchTemplates(component, event, helper);
    
    var actions = [
        {label:'Select Template',name:'submit'}
    ];
    component.set('v.tempcolumns', [
        {label: 'Viesti Pohja', fieldName: 'Name', type: 'text'},
        {label: 'Sisalto', fieldName: 'Sisalto__c', type: 'text'},
        {type:  'action',typeAttributes:{rowActions:actions}}
    ]);
    
    var action = component.get('c.getUserSignature');
    
    action.setCallback(this, function(response){ 
        var state = response.getState();
        if(state === 'SUCCESS') { 
            var responseVal = response.getReturnValue();
            console.log('responseVal: '+responseVal);
            component.set('v.msgValue', responseVal);
            component.set('v.signValue', responseVal);
            
        } 
        else{
            console.log('ERROR...');
        }
    });
    $A.enqueueAction(action); 
},
openModel: function(component, event, helper) {
    component.set("v.isOpen", true);
},
closeModel: function(component, event, helper) { 
    component.set("v.isOpen", false);
},
handleClick: function(event) {
    console.log("###Nitin");
    var action = event.getParam('action');
    console.log("###action: "+action);
    //var recId = event.getParam('row').Name;

},            
loadMoreData : function(component, event, helper) {
    
    event.getSource().set("v.isLoading", true);        
    component.set('v.loadMoreStatus', 'Loading');
    helper.fetchTemplates(component, event, helper);
    
},
createMessage : function(component, event, helper) {
    var action = component.get('c.createMessageRecord');
    var caseId = component.get("v.recordId");
    
    var richtext = component.get("v.msgValue");
    var richTextStr = richtext.replace(/<[^>]*>?/gm, '');
    console.log('richtext: '+richtext);
    
    action.setParams({
        "richText": richtext,
        "caseId"  : caseId
    });
    
    action.setCallback(this, function(response){ 
        var state = response.getState();
        if(state === 'SUCCESS') { 
            var responseVal = response.getReturnValue();
            component.set('v.msgId', responseVal);
            console.log('Message Created');
            var evt = $A.get("e.force:navigateToComponent");
            console.log('Event '+evt);
            var msgId = component.get("v.msgId");
            console.log('msgId1: '+msgId);
            evt.setParams({
                componentDef  : "c:uploadFiles" ,
                componentAttributes : {
                    msgId : msgId
                }
                
                
            });
            evt.fire();
            //component.set('v.msgValue', component.get('v.signValue')); // Once files upload is done then we are refereshing RichText area with Signature value only
        } 
        else{
            console.log('ERROR...');
        }
    });
    
    $A.enqueueAction(action); 
    
},
handleUploadFinished: function (component, event) {
    // Get the list of uploaded files
    var uploadedFiles = event.getParam("files");
    var docIDList = [];
    // Get the file name
    uploadedFiles.forEach(file => docIDList.push(file.documentId));
    console.log('docIDList: '+docIDList);
    component.set('v.attachList', docIDList);
}

})

({
fetchTemplates : function(component, event, helper) {
    
    var action = component.get("c.getTemplateRecords");
    
    action.setCallback(this, function(response) {
        
        var state = response.getState();
        if (state === "SUCCESS") {
            var records = response.getReturnValue();
            records.forEach(function(record){
                record.linkName = '/'+record.Id;
            });
            var currentData = component.get('v.tempList');                
            component.set("v.tempList", currentData.concat(records));
        }
        event.getSource().set("v.isLoading", false);
        
    });
    
    $A.enqueueAction(action);
    
}

})

1 Answer 1

0

I figured out the problem by myself, the problematic part was the below method:

handleClick: function(event) {
    console.log("###Nitin");
    var action = event.getParam('action');
    console.log("###action: "+action);
    //var recId = event.getParam('row').Name;
},

Instead of the above code I needed to use:

 handleRowAction: function(component, event, helper) {
    console.log("###Nitin");
    var action = event.getParam('action').Name;
    console.log("###action: "+action);
    //var recId = event.getParam('row').Name;
}

But I could not able to understand still why handleRowAction function needed all 3 parameters (component, event, helper), instead of just (event).

2
  • In JS, parameters are passed in order from left-to-right. You basically renamed component as event, which is always a SecureComponent. You could make it "obvious" that the first parameter is unused: handleRowAction: function(_, event)
    – sfdcfox
    Jun 28, 2022 at 16:25
  • Thanks for the info @sfdcfox
    – user45297
    Jun 29, 2022 at 13:18

You must log in to answer this question.

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