You need to sign in to do that
Don't have an account?
Anshuman Dixit 5
How to Render a component with Force:inputField inside the lightning:tab
I am using below code the render a child component which has the force:inputField but in the UI child component`s markup(field for entering the details) is not visible, it`s working if i directly call the child component from Parent one
Parent Component:-
<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >
<aura:attribute name="contact" type="Contact" default="{ 'sobjectType': 'Contact','FirstName':'Parent Test'}"/>
<lightning:tabset>
<lightning:tab label="Item One" id='1'>
Item one
</lightning:tab>
<lightning:tab label="Item two" id='2'>
<c:TestNavigateToComponent/>
</lightning:tab>
</lightning:tabset>
</aura:component>
Child Component:-
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >
<aura:attribute name="contact" type="Contact" default="{ 'sobjectType': 'Contact','FirstName':'Child Test' }"/>
<div class="slds">
Test Navigate
<force:inputField aura:id="checkcontact" value="{!v.contact.FirstName}"/>
<force:inputField aura:id="checkcontact1" value="{!v.contact.LastName}"/>
</div>
</aura:component>
Result:-
Please let me know if someone has faced this Problem and figured out how to fix it.
PS:- i know we can use lightning:inputField instead but i am looking to acchieve this from Force:inputField only if that is possible
Parent Component:-
<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >
<aura:attribute name="contact" type="Contact" default="{ 'sobjectType': 'Contact','FirstName':'Parent Test'}"/>
<lightning:tabset>
<lightning:tab label="Item One" id='1'>
Item one
</lightning:tab>
<lightning:tab label="Item two" id='2'>
<c:TestNavigateToComponent/>
</lightning:tab>
</lightning:tabset>
</aura:component>
Child Component:-
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >
<aura:attribute name="contact" type="Contact" default="{ 'sobjectType': 'Contact','FirstName':'Child Test' }"/>
<div class="slds">
Test Navigate
<force:inputField aura:id="checkcontact" value="{!v.contact.FirstName}"/>
<force:inputField aura:id="checkcontact1" value="{!v.contact.LastName}"/>
</div>
</aura:component>
Result:-
Please let me know if someone has faced this Problem and figured out how to fix it.
PS:- i know we can use lightning:inputField instead but i am looking to acchieve this from Force:inputField only if that is possible