function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Mrunal KosareMrunal Kosare 

How to pass a value from VF page to Lightning Component?

NagendraNagendra (Salesforce Developers) 
Hi Mrunal,

Please try this code:

Component Code: 
<!--Lightning Component--><aura:component controller="recieveVal">
&nbsp; &nbsp; <aura:attribute name="vfVal" type="String" default=""/>
&nbsp; &nbsp; <aura:attribute name="ifmsrc" type="String" default=""/>
&nbsp; &nbsp; <aura:handler name="init" value="{!this}" action="{!c.myAction}"/>
&nbsp; &nbsp; {!v.vfVal}
&nbsp; &nbsp; <ui:button press="{!c.getValue}">Get Value</ui:button><br/><br/>
&nbsp;&nbsp; &nbsp;<iframe id="myFrame" style="border: 1px solid" src="{!v.ifmsrc}" />
</aura:component>
Component Controller: 
//component controller
({
&nbsp; &nbsp; myAction : function(component, event, helper) {
&nbsp; &nbsp; &nbsp; &nbsp; component.set("v.ifmsrc", 'https://wk-aakanksha-dev-ed.lightning.force.com/apex/recieveVal');
&nbsp; &nbsp; },
&nbsp;&nbsp; &nbsp;getValue : function(component, event, helper) {
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;var action = component.get("c.getVfVal");
&nbsp; &nbsp; &nbsp; &nbsp; action.setCallback(this,function(a){
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var state = action.getState();
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(state=="SUCCESS"){
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;component.set("v.vfVal",a.getReturnValue()); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; });
&nbsp; &nbsp; &nbsp; &nbsp; $A.enqueueAction(action);
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;var d = new Date();
&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; var n = d.getTime(); &nbsp;
&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; component.set("v.ifmsrc", 'https://wk-aakanksha-dev-ed.lightning.force.com/apex/recieveVal?t='+ n+'&var='+val );
&nbsp;&nbsp; &nbsp;}
})
Apex Controller: 
//Apex Controller
public with sharing class recieveVal {
&nbsp; &nbsp; public static string VfPageVar{get; set;}
&nbsp; &nbsp; public static void sendValue(){
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;if(str != VfPageVar){
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;str = VfPageVar;
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;}
&nbsp;&nbsp; &nbsp;}
&nbsp;&nbsp; &nbsp;
&nbsp;&nbsp; &nbsp;private static string str;
&nbsp;&nbsp; &nbsp;
&nbsp;&nbsp; &nbsp;@AuraEnabled&nbsp;
&nbsp;&nbsp; &nbsp;public static string getVfVal(){
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;showData.sendValue();
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return str;
&nbsp;&nbsp; &nbsp;}
}
Visual Force Page: 
<!--Vf page-->
<apex:page controller="recieveVal" showHeader="false" standardStylesheets="false">
&nbsp;&nbsp; &nbsp;<apex:form id="theform">
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;<apex:inputText value="{!VfPageVar}">
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;<apex:actionSupport event="onchange" action ="{!sendValue}"/>
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;</apex:inputText>
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;page variable:
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;<apex:outputText value="{!VfPageVar}" id="VfPage"/>
&nbsp;&nbsp; &nbsp;</apex:form>
</apex:page>
Hope this helps.

Kindly mark this as solved if my reply was helpful.

Thanks,
Nagendra
Ashif KhanAshif Khan
Hi Mrunal,

You can use as given Below 
<apex:page sidebar="false" showHeader="true">
 <apex:includeLightning />
    <div  id="DataContainer" />
 <script>
 $Lightning.use("c:LightningAppName", function() {
 $Lightning.createComponent("c:LightningCompName",
 { 
 att1: "{!$CurrentPage.parameters.paramId1}",//Url parameter 'paramId1'
 att2:  "{!$CurrentPage.parameters.paramId2}"//Url parameter 'paramId2'
 },
 "DataContainer",
 function(cmp) {
 });
 });
 </script>
</apex:page>

LightningAppName .app 
<aura:application access="GLOBAL" extends="ltng:outApp">
  <aura:dependency resource="c:LightningCompName" />
</aura:application>
LightningCompName​.cmp
  
<aura:component controller="PriceListUpdateController" >

 <aura:attribute name="att1" type="String" default="" />
    <aura:attribute name="att2" type="String" default="" />

{!v.att1} <br/>

{!v.att2}

</aura:component>


I hope this will help you

Regards

Ashif
 
Mrunal KosareMrunal Kosare
Hi,

I do not have an app. I have to pass the value of currently clicked tab to the component.How this can be done?