[SalesForce] Passing attribute from one component to other

Lightning out: I have two components build to be in Lightning out concept. What I understood from theory is that e.force.NavigateToComponent will not work navigating between the components if the system is in classic mode(which is the case here). So I build two VF page pages and navigating between these two components by using "navigateToURL".

First component(SA_AccountLookup): User enters Account Name and on the click of the button making a server call to fetch Account Information and navigating to the second component.

Second component(SA_OppRenewal): I am trying to see whether I can pre load the Account information that I fetched in the first component. This is where I got stuck where I am not sure how to pass the data from first to second component.

How can I achieve this?

<***Application invoked through Lightning out**>
<aura:application description="SA_OppRenewalApplication" access="global" implements="ltng:allowGuestAccess"
        extends="ltng:outApp">
    <aura:dependency resource="c:SA_AccountLookup"/>
    <aura:dependency resource="c:SA_OppRenewal"/>
</aura:application>

<aura:component description="SA_AccountLookup" controller="SA_AccountLookupController">
    <aura:dependency resource="c:SA_OppRenewal"/>
    <aura:attribute name="acntName" type="String"/>
    <aura:attribute name="accountID" type="String" access="public" />
    <lightning:layout horizontalAlign="center">
        <lightning:input name="inputAcntName"
                         aura:id="inputAcntName"
                         type="String"
                         label="Account Name"
                         value="{!v.acntName}"/>
        <div class="slds-modal__footer">
            <lightning:button label="Continue" variant="brand"  onclick="{!c.NavigatetoRenewal}"/>
        </div>

    </lightning:layout>
</aura:component>

({
    NavigatetoRenewal : function(component, event, helper) {
          alert(component.get("v.acntName"));
          var action = component.get("c.getCustomerInfo");
          action.setParams({"acntName": component.get("v.acntName")});
          action.setCallback( this, function(response) {
              var state = response.getState();

              if(state === "SUCCESS"){

                component.set("v.accountID",response.getReturnValue());
                alert("accountID Value"+component.get("v.accountID"));
                ****This is where I wanted to pass the account information to the second component****

                window.open('/apex/SA_OppRenewalPage');
              }
              else if(state === "ERROR") {
                  var errors = response.getError();
                  if (errors) {
                      if (errors[0] && errors[0].message) {
                          console.log("Error message: " +
                                   errors[0].message);
                      }
                  } else {
                      console.log("Unknown error");
                  }
              }
          });
          $A.enqueueAction(action);        
    }
})

<aura:component description="SA_OppRenewal" >
    <aura:attribute name="act" type="Account" default="{ sobjectType: 'Account' }" />
    <aura:attribute name="recordId" type="String" access="public"/>


   <div class="slds">
       <div class="slds-page-header" role="banner">
           <div class="slds-media__body">
               <p class="slds-text-heading--label">Account</p>
               <h1 class="slds-text-heading--medium">{!v.act.Name}</h1>
           </div>
       </div>
       <div class="slds-form-element slds-m-bottom--small slds-is-required">
           <label class="slds-form-element__label" for="Name">Name</label>
           <input id="Name" class="slds-input" type="text" value="{!v.act.Name}"/>
       </div>
       <div class="slds-form-element slds-m-bottom--small slds-is-required">
           <label class="slds-form-element__label" for="Name">Estimated Annual Revenue</label>
           <input id="Name" class="slds-input" type="text" value="{!v.act.AnnualRevenue}"/>
       </div>
       <div class="slds-form-element slds-m-bottom--small slds-is-required">
           <label class="slds-form-element__label" for="WorkType">Industry</label>
           <force:inputField aura:id="pwt" value="{!v.act.Industry}"/>
       </div>
   </div>
</aura:component>

public with sharing class SA_AccountLookupController {


    @AuraEnabled
    public static List<Account> getCustomerInfo(String acntName){
        List<Account> custInfo = [SELECT Id FROM Account WHERE Name =: acntName];
        System.debug('CustomInfo'+custInfo);
        return custInfo;
    }
}

Best Answer

Try this format for dependencies -

<aura:dependency resource="markup://c:SA_OppRenewal" />
Related Topic