0

So, I had a problem with navigating from Parent component to Child component, but it was solved. But now I have even more strange problem.

So, I did navigation from Parent component to the Child one, but I also need to make navigation from Child component to Baby component. I used exact same code for .js methods and same edits for components, but still, it doesn't work.

Parent component:

<aura:component implements="force:appHostable, lightning:isUrlAddressable" access="global">
<aura:attribute name="typename" type="string" required="true" default="test type" />
<aura:attribute name="pageReference" type="object" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<lightning:navigation aura:id="navService"/>
<div style="align-content: center">
    <div class="c-container slds-theme_default custom-container">
        <lightning:layout multipleRows="true">
            <lightning:layoutItem padding="around-small" size="12">
                <div class="page-section page-header slds-align_absolute-center">
                    <h1>
                        New Work Type
                    </h1>
                </div>
            </lightning:layoutItem>
            <div style="align-content: center;">
                <lightning:layoutItem padding="around-small" size="12">
                    <lightning:layout>
                        <lightning:layoutItem padding="around-small" size="4">
                            <div class="page-section page-main custom-form">
                                <div class="custom-input">
                                    <lightning:input aura:id="typename" value="{!v.typename}" label="Work Type Name" required="true" />
                                    <lightning:button variant="brand" class="slds-float_right" label="Next" onclick="{!c.navigateToMyComponent}" />
                                </div>
                            </div>
                        </lightning:layoutItem>
                    </lightning:layout>
                </lightning:layoutItem>
            </div>
        </lightning:layout>
    </div>
</div>

Parent component controller:

({
doInit: function (component, event, helper) {
    var pageReference = {
        type: 'standard__controller',
        attributes: {
            componentName: 'c__CarServiceComponent2'
        },
            state: {
                "c__requiredFor": "{!v.typename}"
            }
    };
    component.set("v.pageReference", pageReference);
},

navigateToMyComponent: function (component, event, helper) {
    var navService = component.find("navService");
    var pageReference = component.get("v.pageReference");
    event.preventDefault();
    navService.navigate(pageReference);
},})

Child component:

<aura:component implements="force:appHostable, lightning:isUrlAddressable" description="c:CarServiceComponent2" access="global">
<aura:attribute name="requiredFor" type="string" required="true" default="test" />
<aura:attribute name="redirect" type="string" access="global" />
<aura:handler name="change" value="{!v.pageReference}" action="{!c.onPageReferenceChange}"/>
<aura:handler name="init" value="{!this}" action="{!c.onPageReferenceChange}" />
<div style="align-content: center;">
    <div class="c-container slds-theme_default custom-container">
        <lightning:layout multipleRows="true">
            <lightning:layoutItem padding="around-small" size="12">
                <div class="page-section page-header slds-align_absolute-center">
                    <h1>
                        New Skill Requirement
                    </h1>
                </div>
            </lightning:layoutItem>
            <lightning:layoutItem padding="around-small" size="12">
                <lightning:layout>
                    <lightning:layoutItem padding="around-small" size="4">
                        <div class="page-section page-main custom-form">
                            <div class="custom-input" style="align-content: center;">
                                <lightning:input aura:id="requiredFor" label="Required For" value="{!v.requiredFor}"
                                    required="true" />
                        </div>
                        </div>
                    </lightning:layoutItem>
                </lightning:layout>
            </lightning:layoutItem>
        </lightning:layout>
    </div>
</div>

Child component controller

({
onPageReferenceChange: function(cmp, evt, helper) {
    var myPageRef = cmp.get("v.pageReference");
    var requiredFor = myPageRef.state.c__requiredFor;
    cmp.set("v.requiredFor", requiredFor);
},
doInit: function(component, event, helper){

}})

Baby component:

<aura:component implements="force:appHostable, lightning:isUrlAddressable" access="global">
<aura:attribute name="parentRecord" type="string" required="true" default="test type" />
<aura:attribute name="pageReference" type="object" />
<aura:handler name="init" value="{!this}" action="{!c.onPageReferenceChange}" />
<aura:handler name="change" value="{!v.pageReference}" action="{!c.onPageReferenceChange}"/>
<lightning:navigation aura:id="navService"/>
<div style="align-content: center">
    <div class="c-container slds-theme_default custom-container">
        <lightning:layout multipleRows="true">
            <lightning:layoutItem padding="around-small" size="12">
                <div class="page-section page-header slds-align_absolute-center">
                    <h1>
                        New Product Required
                    </h1>
                </div>
            </lightning:layoutItem>
            <div style="align-content: center;">
                <lightning:layoutItem padding="around-small" size="12">
                    <lightning:layout>
                        <lightning:layoutItem padding="around-small" size="4">
                            <div class="page-section page-main custom-form">
                                <div class="custom-input">
                                    <lightning:input aura:id="parentRecord" value="{!v.parentRecord}" label="Parent Record" required="true" />
                                    <lightning:button variant="brand" class="slds-float_right" label="Next" />
                                </div>
                            </div>
                        </lightning:layoutItem>
                    </lightning:layout>
                </lightning:layoutItem>
            </div>
        </lightning:layout>
    </div>
</div>

Baby component controller:

({
doInit : function(component, event, helper) {

},
onPageReferenceChange: function (cmp, evt, helper) {
    var myPageRef = cmp.get("v.pageReference");
    var parentRecord = myPageRef.state.c__parentRecord;
    cmp.set("v.parentRecord", parentRecord);
}})
0

there is no standard__controller page reference type page references, you should use standard__component instead of

var pageReference = {
    type: 'standard__component', // there is no standard__controller page reference
    attributes: {
        componentName: 'c__CarServiceComponent2'
    },
        state: {
            "c__requiredFor": "{!v.typename}"
        }
};

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.