0

I have a component which iterates over a list of records and in turn calls a child component for each record returned. This works fine. I also have a lightning:slider in a seperate component which when changed, fires an application event containing a string to use as a filter on the list of records in the list component.

I can get the string value into the event handler and can see it logging in the console when changed. However, when I use this string value as a filter on the list of records I get an exception (sreenshot attached). My understanding is that lightning:recordViewForm is being passed a null record Id. However I dont see how this is possible as I'm checking the list size before setting the list attribute. Can anyone help?

Related question (unanswered): Error occurs on lightning:recordViewForm

Thanks

Event:

<aura:event type="APPLICATION" description="MovieGenreEvent">
<aura:attribute name="movieYear" type="String"/>
</aura:event>

Component firing the event:

<aura:component description="MovieSearchSlider" implements="flexipage:availableForAllPageTypes" access="global">

<aura:attribute name="SliderValue" type="String" default="2004" />
<aura:registerEvent name="MovieGenreEvent" type="c:MovieGenreEvent" />

<lightning:slider label="Volume" value="{!v.SliderValue}" onchange="{!c.handleSlide}" min="1990" max="2030" />

</aura:component>

Controller:

handleSlide : function(component, event) {

        let sliderValue = component.get("v.SliderValue");
        console.log("sliderValue " + sliderValue);
        var applicationEvent = $A.get("e.c:MovieGenreEvent");
        applicationEvent.setParam("movieYear", sliderValue);
        applicationEvent.fire();
        console.log("FIRED");
        console.log(applicationEvent);
    }

Component Receiving the event:

<aura:component description="movieSearchList" controller="movieSearchController" implements="flexipage:availableForAllPageTypes,force:hasRecordId" access="global">
<aura:attribute name="movies" type="Movie__c[]"/>
<aura:attribute name="movieYearFilter" type="String"/>

<aura:handler event="c:MovieGenreEvent" action="{!c.handleEvent}" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<ul class="list-group">
    <lightning:card title="Movies">
        <div class="slds-p-left_medium slds-p-right_medium">
            <ul class="slds-list_vertical slds-has-dividers_top-space">
                <aura:if  isTrue="{!v.movies}">
                    <aura:iteration items="{!v.movies}" var="movie">
                        <li class="slds-list__item">
                            <c:movieSearchRecord movie="{!movie}"/>
                        </li>
                    </aura:iteration>
                </aura:if>
            </ul>
        </div>
    </lightning:card>
</ul>
</aura:component>

Controller:

handleEvent : function(component, event, helper) {

    var movieYearFromEvent = event.getParam("movieYear");
    console.log('movieYear = ' + movieYearFromEvent);
    helper.filterByYear(component, movieYearFromEvent);

}

Helper:

filterByYear : function(component, movieYear, event) {

    let movies = component.get("v.movies");
    let filteredMovies = movies.filter(movie => movie.Year__c == movieYear);
    console.log(filteredMovies);

    if (filteredMovies.length >= 1) { 
        component.set("v.movies", filteredMovies);
    }

}

MovieSearchRecord:

    <aura:component description="movieSearchRecord">
    <aura:attribute name="movie" type="Movie__c"/>
    <lightning:recordViewForm aura:id="viewForm" recordId="{!v.movie.Id}" objectApiName="Movie__c">
        <div class="slds-media">
            <div class="slds-media__figure">
                <img src="{!v.movie.Cover_URL__c}" class="slds-avatar_large slds-avatar slds-image__crop--4x3"/>

            </div>
            <div class="slds-media__body">
                <lightning:layout multipleRows="true">
                    <lightning:layoutItem size="6">
                        <lightning:layout class="slds-hint-parent">
                            <a onclick="{!c.navToRecord}">
                                <h3 class="slds-text-heading_small slds-m-bottom_xx-small">{!v.movie.Name}</h3>
                            </a>
                        </lightning:layout>
                    </lightning:layoutItem>
                </lightning:layout>
            </div>
        </div>
    </lightning:recordViewForm>
</aura:component>

enter image description here

  • I don't see the snippet for lighting:recordViewForm & handleRecordIdChange, where/how are you using that? – Jayant Das Oct 12 '18 at 1:30
  • Hi Jayant, apologies.. it's in there now - MovieSearchRecord. Thanks – Jay Oct 12 '18 at 8:42
  • With regards to your other point on handleRecordIdChange, this is not a function i have built anywhere in my org. I can only guess that it's something apex is doing under the hood – Jay Oct 12 '18 at 17:43
0

It ended up being a capitalised character on "Id" needing to be changed to id:

<lightning:recordViewForm aura:id="viewForm" recordId="{!v.movie.Id}" 
0

I've had the same error and this happened to fix it:

recordId="{!if(v.recordId, v.recordId, '')}"

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.