Access parent record id from visualforce page called in custom list button?

Question

I’m trying to create a custom List button that can call a Lightning Component. However because that’s not yet directly possible, I’m trying to embed the Lightning Component in a Visualforce page and call it that way.

Which works - I get a screen with the contents of the Lightning component when I click the List button.

However I can’t seem to get any relevant Id’s to work with (ie either the ID of the parent Opportunity where the related list is displayed, or the list of IDs of the records that are currently displayed in the related list). I can get a list of the IDs of all the records of the related list objects that exist in the system (printed above) but that isn’t helpful. I want the Lightning Component to be able to make updates on the records listed in the related list.

And now for the code...

Visualforce page that is called from the custom List button “Release Hold via vf page”:

<apex:page standardController="Reservable_Hold__c" recordSetVar="Holds">
    <apex:includeLightning />

    <div id="RemoveHold"/>

    <div>
        <apex:dataList value="{!Holds}" var="item">
            <apex:outputText value="{!item}"/>
        </apex:dataList>  
    </div>

    <script>
    var objHolds = '{!Holds}';
    var arrayHolds = objHolds.split(",");
    console.log("arrayHolds: " + arrayHolds + " arrayHolds[0]: " + arrayHolds[0] + " arrayHolds[1]: " + arrayHolds[1]);
    $Lightning.use("c:LightningComponents", function() {
        $Lightning.createComponent("c:HoldOff",
                                   {"recordId" : arrayHolds[1]},
                                   "RemoveHold",
                                   function(component){
                                       alert("successfully created the Remove Hold component with the Holds: {!Holds}");
                                   }
                                  );
    });
    </script>

</apex:page>

So in the second screenshot, the top part is the Lightning Component which is returning just fine, and the list of IDs currently displayed is a list of all the records of the related list object that exist in the system (only a handful as I’m in a sandbox). For now I’m just trying to get a useful record ID to print here so eventually I’ll pass it to the Lightning Component to work on.

In the first screenshot, I know that if the person clicks into “View All” then they could select the relevant records using checkboxes and I would get those Ids in the recordSetVar list, but that was not preferable as without a visual cue here the person wouldn’t easily know from this page how to release the holds.

So - is it possible in the visualforce page to get the record ID of the parent Opportunity or else get a list of just the related records displaying in the list instead of all records? Before/without manually selecting the records in the “View All” screen?

---

(For more context or if someone has a better idea of how to approach this, here’s the bigger picture of the problem I’m trying to solve: Desired requirement was to add an option to the action drop-down list on the row level called “Release Hold.”

Because it’s currently not possible to add items there, the next idea was to create the button at the top of the related list and manage the full list from the Lightning Component instead of one record at a time.

It seems really ridiculous to build a related list component from scratch just to get this functionality (especially because there’s no standard Lightning component related list yet) so I’m hoping there’s a better way…)

Answer 1

I was able to access the Parent record Id using the below code.

<script>
    $Lightning.use("c:LAPP_CreateReturnRequest", function() {
      $Lightning.createComponent("c:LCMP_CreateReturnRequest",
          { opportunityId : '{!$CurrentPage.parameters.id}' },
          "lightning",
          function(cmp) {
            alert('component created successfully');
          }
      );
    });
</script>