We have a VF page with Lightning components on it. we need to read a User input (i.e. Apex control value) inside my lightning component JS controller.
It seems that,
document.getElementById("apexCntId").value
is not available now. What are the options available for us to read Apex page element from JS controller?
Can we update some <aura:attribute> inside lightning component which is created using $Lightning.createComponent()? I couldn't find a doc to go with this approach.
You need to fire an event at your component. I don't have time to actually test this, but something like the following should work:
<!-- Visualforce snippet -->
<script>
function sendDataToLightning(el) {
var evt = ($A || window.opener.$A).get("e.c:updateComponentValue");
evt.setParams( { value: el.value } );
evt.fireEvent();
}
</script>
<input type="text" onchange="sendDataToLightning(this);" />
<!-- Lightning component snippet -->
<aura:handler event="c:updateComponentValue" action="{!c.updateValue}" />
Note that what I'm implying is that you must communicate across the Visualforce/Lightning barrier via events. You can listen for Lightning Events in Visualforce, and you can listen for Lightning Events initiated outside of Lightning to update your component's state. See Firing Lightning Events from Non-Lightning Code as an example.
Your Lightning component's controller operates in a separate namespace than your visualforce page does and won't be accessible directly from your page without passing values from the Lightning component's controller by either passing them from the controller to an Apex controller or by setting Attributes within the Component's Controller that apply to variables used on your page.
If you define <aura:attributes> in your component, then use set("v.value", somevar.value) in your component's controller (or a helper), that will set the attribute's value for all components within the namespace which should also pass them into the visualforce page just as it would in a Lightning page.
