I have the following codes:
Event
<aura:event access="global" type="COMPONENT" description="Event template" > <aura:attribute name="data" type="String"/> <aura:attribute name="sample" type="String"/> </aura:event> testcomp:
<aura:component > <aura:handler name="TEST_Event" event="c:testevent" action="{!c.handleComponentEvent}"/> <aura:attribute name="dataValue" type="String" default="testselect"/> <aura:attribute name="sampl" type="String" /> <aura:if isTrue="{!v.dataValue == 'testselect'}"> <c:testselect/> </aura:if> <aura:if isTrue="{!v.dataValue == 'testcomp2'}"> <c:testcomp2 testdata="{!v.sampl}"/> </aura:if> </aura:component> testcomp controller js:
({ handleComponentEvent : function(component, event) { var cmpdata = event.getParam("data"); component.set("v.dataValue", cmpdata); var cmpmm = event.getParam("sample"); component.set("v.sampl", cmpmm); console.log('dataValue '+component.get("v.dataValue")); console.log('msg '+component.get("v.sampl")); } }) testselect:
<aura:component > <aura:registerEvent name="TEST_Event" type="c:testevent"/> <table class="slds-table slds-table_cell-buffer slds-table_bordered"> <thead> <tr ><th ><div >Sample Table</div></th></tr> </thead> <tbody><tr class="slds-hint-parent"><th data-label="Batch Donation Form Name" scope="row"> <div class="slds-truncate" ><a aura:id="sampleId" data-value="id12345" onclick="{!c.gotoNext}">message 1</a></div> </th> </tr> </tbody> </table> </aura:component> testselect controller js:
({ gotoNext:function(component, event, helper){ var trId = event.currentTarget.dataset.value; console.log('trId '+trId); var nextpage = "testcomp2"; var cmpEvent = component.getEvent("TEST_Event"); cmpEvent.setParams({ "data" : nextpage, "sample" : trId}); cmpEvent.fire(); }}) testcomp2:
<aura:component > <aura:registerEvent name="TEST_Event" type="c:testevent"/> <aura:attribute name="testdata" type="String" /> <label>Output data here: {!v.testdata}</label> <aura:handler name="init" action="{!c.doInit}" value="{!this}" /> </aura:component> testcomp2 controller js:
({ doInit : function(component, event, helper) { var sid = event.getParam("sample"); component.set("v.testdata",sid); console.log('testdata '+component.get("v.testdata")); }}) it worked well and the sample value is displayed but when I get the value - component.get("v.testdata"), it gets an undefined value. I'm supposed to use it for my query but I didnt get any value though it displays in the page. what might went wrong?