• Roronoa_Zoro
  • NEWBIE
  • 0 Points
  • Member since 2017

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 1
    Questions
  • 0
    Replies
Hi, 
I have created the following components for this step:

BoatSearchForm.cmp
<aura:component controller="BoatSearchForm" implements="force:appHostable,flexipage:availableForAllPageTypes"  access="global" >
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <aura:attribute name="searchOptions" type='String[]' default='All'/>
    <aura:attribute name='searchOptionToIdMap' type='Map' default="{All:''}" />
    <aura:attribute name='showNewButton' type='Boolean' default='false'/>

    <lightning:layout horizontalAlign="center"   >

       <lightning:layoutItem class="slds-grid_vertical-align-center" > 

           <lightning:select aura:id='typeSelect' name='selectItem' onchange=''>
             <aura:iteration items='{!v.searchOptions}' var='option'>
                 <option value='{!option}' text='{!option}'></option>
             </aura:iteration>
         </lightning:select>
       </lightning:layoutItem>

       <lightning:layoutItem class="slds-grid_vertical-align-center" > 
         <lightning:button label="Search" variant="brand"  />
         <aura:if isTrue='{!v.showNewButton}'>
            <lightning:button variant='neutral' label='New' onclick='{!c.createBoat}'/>
        </aura:if>
       </lightning:layoutItem>

    </lightning:layout>

</aura:component>

BoatSearchController.js
({
     doInit: function(component) 
    {
       console.log('inside do init '); 
        debugger;
       var action=component.get('c.getSearchOptions');
        action.setcallback(this,function(response)
         {
             debugger;
             var state = response.getState();
             if (state === "SUCCESS")
             {
                 debugger;
                 console.log('inside success state');
                 component.set('v.searchOptionToIdMap',response.getReturnValue());
                 var custs = [];
                 var conts = response.getReturnValue();
                 for(var key in conts)
                 {
                    console.log('populated list');
                     custs.push({value:conts[key], key:key});
                 }
                 component.set("v.searchOptions", custs);
             }
             
         }); 
    }, 
     createBoat: function (component) 
     {
            console.log('inside controller');
            var createRecordEvent = $A.get('e.force:createRecord');
            if (createRecordEvent) 
            {
                    var typeName = component.find('typeSelect').get('v.value');
                    var typeMap = component.get('v.searchOptionToIdMap');
                    var typeId = null;
                    if (typeName && typeMap && typeMap[typeName]) 
                    {
                            typeId = typeMap[typeName];
                    }
                    createRecordEvent.setParams({
                        'entityApiName': 'Boat__c',
                        'defaultFieldValues': {
                            'BoatType__c': typeId
                        }
                    });
                    createRecordEvent.fire();
            }
       }
})
BoatSearchHelper.js
({
    renderNewButton: function (component) {
    var createRecordEvent = $A.get('e.force:createRecord');
    if (createRecordEvent) {
        component.set('v.showNewButton', true);
    }
}})

Apex Controller:
public with sharing class BoatSearchForm
{
        @AuraEnabled
        public static Map<String, String> getSearchOptions() 
        {
                List<BoatType__c> boatTypes = [SELECT Id, Name FROM BoatType__c LIMIT 400];
                Map<String, String> returnMap = new Map<String, String>();
                if(!boatTypes.isEmpty())
                {
                        for(BoatType__c bt: boatTypes)
                        {
                            returnMap.put(bt.Name, bt.Id);
                        }
                }
                return returnMap;
        }
}
FriendswithBoat.app
<aura:application extends="force:slds">
    <lightning:layout >
                 
                 <lightning:card title="Find a Boat" class="slds-m-top_10px" >
                          <c:BoatSearchForm />
                 </lightning:card>

    </lightning:layout>
</aura:application>

Whenever I try to load my app I get this error:
User-added image

Something is wrong with my component. I am not able to identify it. Can anyone help me with this?