6

Scenerio:

Create a custom button on order layout. On clicking of this button it will display order information in lightning.

To achieve this:

  1. Create a custom button
  2. Created a apex controller to get the order details
  3. Created a lightning component to display order details
  4. Created a VF Page and put that component in that page
  5. put that page in the button

Problem:

I do not why doInit method is being called twice, where first time it gets the id as null and in second time it gets the id perfectly. I checked it using Console.log.

<aura:component implements="force:appHostable,force:hasRecordId,flexipage:availableForRecordHome" controller="OrderController">
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:attribute name="recordId" type="Id" />
<aura:attribute name="ord" type="order"/>
<div >
    Order No:- {!v.ord.OrderNumber}<br/>
    Account No:- {!v.ord.Account.Name}       
</div>
</aura:component>

VF Page:

<apex:page standardStylesheets="false" sidebar="false"     showHeader="false" standardController="Order">

 <apex:includeLightning />
<div id="lightning" /> 
<script>
    $Lightning.use("c:OrdersMainApp", function() {
    $Lightning.createComponent("orderComponent",
                               { recordId:'{!Order.Id}'
                                 },
                               "lightning",
                               function(cmp) {

                               });
                               });


</script>
</apex:page>

Client Side Controller:

 ({
doInit : function(component, event, helper) {
    var recordId = component.get("v.recordId"); 
    console.log('test##'+recordId); **// prints 2 times. First time value is null and second time proper order id** 
    var action = component.get("c.getOrderDetails");
    action.setParams({
            "OrdId": recordId
    });
    action.setCallback(this, function(response){
        var state = response.getState();
        if (component.isValid() && state === "SUCCESS") {
            var ord = response.getReturnValue();
         //   component.set("v.orType", ord.Type);
            component.set("v.ord", ord);
        }
    });

    $A.enqueueAction(action);

}
})

Apex Controller:

public with sharing class OrderController {

@AuraEnabled
public static Order getOrderDetails(Id OrdId) { // In debug console I can see this method gets executed two times 
    System.debug('####'+OrdId); **//  First time it gives null which causes list has no rows error** 
    Order orders =  
            [SELECT Id, AccountId, Account.BillingStreet, Account.BillingCity, Account.BillingState, Account.BillingPostalCode,
             Account.BillingCountry,Account.Name,Status, ContractId,Account.Phone, OrderNumber, Contract.ContractNumber,TotalAmount,Name, EndDate FROM Order Where Id= :ordId limit 1 ];
    return orders;
    }
}

Application:

<aura:application access="GLOBAL" extends="ltng:outApp" >
  <c:orderComponent /> 
</aura:application>

1 Answer 1

6

Because you have the component in your app as an actual component and not just a dependency. Thus it runs when the app is loaded and when the VFP create it and injects it into the page

Change it to this:

<aura:application access="GLOBAL" extends="ltng:outApp" >
  <aura:dependency resource="c:orderComponent"/>
</aura:application>

You only need to define the dependency in the App if you are using it in the Lightning out VFP.

2
  • Thanks a lot Eric !!! It worked. You are the Savior. Cheers !!! Mar 24, 2017 at 6:18
  • @ArpitSethi glad I could help
    – Eric
    Mar 24, 2017 at 6:18

You must log in to answer this question.

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