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

3
  • I don't see the snippet for lighting:recordViewForm & handleRecordIdChange, where/how are you using that?
    – Jayant Das
    Oct 12, 2018 at 1:30
  • Hi Jayant, apologies.. it's in there now - MovieSearchRecord. Thanks
    – Jay
    Oct 12, 2018 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, 2018 at 17:43

2 Answers 2

1

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, '')}"

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .