0

Bit lost and stressed about this. I've been working on a feature that has had two requirements so far, and I'm pretty stuck on how to go about the second. For some background, the component runs on initialization and is on the lightning record page for the Parent__c record, which is the Master in the Master-Detail relationship between Parent__c and Children__c. This component runs in the Lightning Service Console. The requirements are:

1) Retrieve a list of all associated Children__c records from the current Parent__c and display them on the record page. (Done).

2) Open a Subtab for each Children__c record (Stuck).

Whatever I do, I can't seem to get started on the second function (kicking off the loop to open the subtabs). I always encounter an error stating that "workspaceAPI" is undefined when I load the component on the page. When I stop at the first function, I can see the values displayed on the component, but triggering the tab(s) to open seems to be a wall. Any help is appreciated!

Component:

 <aura:component access="global" controller="LSCOpenSubtabs" implements="flexipage:availableForAllPageTypes,force:hasRecordId,force:hasSObjectName,lightning:isURLAddressable,lightning:hasPageReference">
<aura:attribute name="pageReference" type="Object"/>
<aura:attribute name="childrenToOpen" type="Children__c"/>
<lightning:navigation aura:id="navService"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />

<div class="slds-show slds-scrollable--y">
   <aura:iteration items="{!v.childrenToOpen}" var="children">
       <tr>
       <th scope="row"><div class="slds-truncate" title="{!children.Id}">{!children.Id}</div></th>
       <td><div class="slds-truncate" title="{!children.Name}">{!children.Name}</div></td>
       <td><div class="slds-truncate" title="{!children.Name}">{!children.Parent__c}</div></td>

       </tr>

   </aura:iteration>
</div>

JS Controller:

({
doInit: function(component, event, helper) {

    helper.getChildren(component)



}

})

JS Helper:

({
getChildren : function(component) {
    var action = component.get("c.children");
    action.setParams({getCurrentParentId : component.get("v.recordId")});
    action.setCallback(this,function(response){
        var state = response.getState();
        if (state === "SUCCESS")
        {
            component.set("v.childrenToOpen", response.getReturnValue());
            console.log("v.childrenToOpen.length") 
            var tabs = component.get("v.childrenToOpen");
            var items =[];

            for(i = 0; i < tabs.length; i++ ) 

            {

                var workspaceAPI = component.find("workspace");
    var subTabId = component.get("v.children.Id")    
    workspaceAPI.getEnclosingTabId().then(function(enclosingTabId) {
        workspaceAPI.openSubtab({
            parentTabId: enclosingTabId,
            recordId : children.Id,
            focus: true

        }).then(function(subtabId) {
            console.log("The new subtab ID is:" + subtabId);
        }).catch(function(error) {
            console.log("error");
        });
    });




    $A.enqueueAction(workspaceAPI);


            }

Apex Controller:

public without sharing class LSCOpenSubtabs {

@AuraEnabled
 public static List<Children__c> children (string getCurrentParentId){

 return[SELECT Id, Name, Parent__c FROM Children__c WHERE Parent__c =:getCurrentParentId];


 }

 }

1 Answer 1

1

I think you have made a simple mistake of not declaring 'workspaceAPI' in your component.<lightning:workspaceAPI aura:id="workspace"/> Can you please change the code of your component as below:

<aura:component access="global" controller="LSCOpenSubtabs" implements="flexipage:availableForAllPageTypes,force:hasRecordId,force:hasSObjectName,lightning:isURLAddressable,lightning:hasPageReference">
<aura:attribute name="pageReference" type="Object"/>
<aura:attribute name="childrenToOpen" type="Children__c"/>
<lightning:navigation aura:id="navService"/>
<lightning:workspaceAPI aura:id="workspace"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />

<div class="slds-show slds-scrollable--y">
<aura:iteration items="{!v.childrenToOpen}" var="children">
   <tr>
   <th scope="row"><div class="slds-truncate" title="{!children.Id}">{!children.Id}</div></th>
   <td><div class="slds-truncate" title="{!children.Name}">{!children.Name}</div></td>
   <td><div class="slds-truncate" title="{!children.Name}">{!children.Parent__c}</div></td>

   </tr>

</aura:iteration>
</div>

Please also refer the documentation here

Improvement to JS Helper file

getChildren : function(component) {
    let workspaceAPI = component.find("workspace");
    let action = component.get("c.children");
    action.setParams({getCurrentParentId : component.get("v.recordId")});
    action.setCallback(this,function(response){
        let state = response.getState();
        if (state === "SUCCESS")
        {
            component.set("v.childrenToOpen", response.getReturnValue());
            console.log("v.childrenToOpen.length") 
            let tabs = component.get("v.childrenToOpen");
            let enclosingTabId;
            workspaceAPI.getFocusedTabInfo().then(function(response) {
                if(response.isSubtab) { // if the record is on a subtab
                    enclosingTabId = response.parentTabId;
                    tabs.forEach(function(children) {
                        workspaceAPI.openSubtab({
                            parentTabId: enclosingTabId,
                            recordId : children.Id,
                            focus: true

                        }).then(function(subtabId) {
                            console.log("The new subtab ID is:" + subtabId);
                        }).catch(function(error) {
                            console.log("error");
                        });
                    });
                }
                else { // if the record is a primary tab
                    enclosingTabId = response.tabId;
                    tabs.forEach(function(children) {
                        workspaceAPI.openSubtab({
                            parentTabId: enclosingTabId,
                            recordId : children.Id,
                            focus: true

                        }).then(function(subtabId) {
                            console.log("The new subtab ID is:" + subtabId);
                        }).catch(function(error) {
                            console.log("error");
                        });
                    });
                }
            });

        }
        else {
            console.log('No records found');
        }
    });
    $A.enqueueAction(action);
}
4
  • 1
    +1.. improvement - Do you really need finding worspaceAPI for every child record? There are code improvements which should be suggested ( also use forEach func ) Sep 3, 2019 at 2:18
  • yes @salesforce-sas His JS Helper file needs improvement Sep 3, 2019 at 2:25
  • Thanks for the feedback! I guess I don't need workspaceAPI for every child record. I'm pretty new to this and definitely need some code clean-up on my end. Sep 3, 2019 at 4:08
  • This all worked perfectly, thank you so much everyone!!!!!!! Sep 3, 2019 at 4:25

You must log in to answer this question.

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