I have no idea what's going wrong, so I'll just paste all the code I've got and let you share in the madness. Basically I want to fire an application event that takes the value from a lightning:input search bar as an attribute (lightning:input - search never worked for me so I'm trying to build a generic workaround component). Problem is I always get this error:
Uncaught TypeError: Cannot read property 'setParams' of undefined throws at components/c/CCW_Generic_Searchbar.js:65:14
I set up everything the way I always do, basically copied and pasted from other working components, but nothing I do fixes it. Remade the event, rewrote everything, I'm out of ideas. Any advice would be greatly appreciated.
.cmp:
<aura:registerEvent name="CCW_Generic_Searchbar_Event_2" type="c:CCW_Generic_Searchbar_Event_2"/>
<aura:handler event="c:CCW_Generic_Searchbar_Event_2" action="{!c.handleSearch}"/>
<aura:attribute name="label" type="String" default="Search"/>
<aura:attribute name="placeHolder" type="String" default="Search"/>
<aura:attribute name="id" type="String" default="-1"/>
<aura:attribute name="GlobalId" type="String" access="GLOBAL" description="super id" />
<aura:attribute name="input" type="String"/>
<aura:attribute name="output" type="String" default="output"/>
<aura:attribute name="initialized" type="Boolean" default="false"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:handler name="change" value="{!v.initialized}" action="{!c.onRender}"/>
<div id="{!GlobalId + '_search'}">
<form>
<lightning:input type="search" label="Search" name="search" aura:id="bar" placeholder="{!v.placeHolder}"/>
</form>
</div>
<h1>{!v.output}</h1>
controller.js:
doInit : function(component, event, helper){
component.set("v.initialized", true);
console.log('end doInit');
},
onRender : function(component, event, helper) {
console.log('in onRender 1');
setTimeout(function(){
var searchId = component.getGlobalId() + '_search';
console.log('in onRender 2, searchId = '+searchId);
document.getElementById(searchId).addEventListener("keyup", function(e) {
console.log('in onRender 3 event listener');
if ((e.keyCode || e.which) == 13) {
console.log('in onRender 4 enter');
var id = component.get("v.id");
var input = component.get("v.input");
component.set("v.input", '');
helper.runSearch(component);
} else {
console.log('in onRender 5 else');
helper.inputChange(component);
}
});
}, 100);
console.log('in onRender 6 end on render');
},
handleSearch : function(component, event, helper){
console.log('search handled');
var id = event.getParam("idn");
var input = event.getParam("input");
var output = 'output: id = '+id+', search = '+input;
component.set("v.output", output);
}
helper.js:
runSearch : function(component) {
console.log('in runSearch 1');
var event = $A.get("e.c:CCW_Generic_Searchbar_Event_2");
event.setParams({"input": input, "idn":String(id)});
console.log(event);
event.fire();
},
inputChange : function(component){
console.log('in inputChange 1');
var value = component.find('bar').get('v.value');
component.set("v.input", value);
}
event.evt:
<aura:event type="APPLICATION" description="Generic Search Event">
<aura:attribute name="input" type="String"/>
<aura:attribute name="idn" type="String"/>
</aura:event>
I suspect it has something to do with how the event is being registered?