1

I have been trying to implement a custom search in communities whereby the user can type in the first line of the address and the search will update with each keystroke. But I receive this error:

Action failed: c$ContactList$controller$searchKeyChange [Cannot read property 'setParams' of null] Failing descriptor: {c$ContactList$controller$searchKeyChange}

The code in question is below.

ContactList.cmp

<aura:component controller="ContactListController">

<aura:attribute name="accounts" type="account[]"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:handler event="c:SearchKeyChange" action="{!c.searchKeyChange}"/>

<ul>
    <aura:iteration items="{!v.accounts}" var="account">
        <li>
            <a href="{! '#/sObject/' + account.Id + '/view'}">
                <p>{!account.Name}</p>
                <p>{!account.Phone}</p>
                <p>{!account.BillingStreet}</p>
            </a>
        </li>
    </aura:iteration>
</ul>

ContactListController.js

({
doInit : function(component, event) {
    var action = component.get("c.findAll");
    action.setCallback(this, function(a) {
        component.set("v.accounts", a.getReturnValue());
    });
    $A.enqueueAction(action);
},


searchKeyChange: function(component, event) {
var searchKey = event.getParam("searchKey");
var action = component.get("e.c.findAll");
action.setParams({
  "searchKey": searchKey
});
action.setCallback(this, function(a) {
    component.set("v.accounts", a.getReturnValue());
});
$A.enqueueAction(action);
}
})

SearchBar.cmp

<aura:component >
<div>
    <input type="text" class="form-control"
           placeholder="Search" onkeyup="{!c.searchKeyChange}"/>
</div>

SearchBarController.js

({
searchKeyChange : function(component, event, helper) {
    var myEvent = $A.get("e.c:SearchKeyChange");
    myEvent.setParams({"searchKey":event.target.value});
    myEvent.fire();
}
})

SearchKeyChange.evt

<aura:event type="APPLICATION">
    <aura:attribute name="searchKey" type="String"/>
</aura:event>

I can't for the life of me figure out what the issue is. Any feedback would be great.

4

Assuming that findAll is the remote method in your controller, I believe that your line in ContactListController.js:

var action = component.get("e.c.findAll");

should be:

var action = component.get("c.findAll");

This is causing the action to be null and the reference to setParams to throw an error.

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.