<aura:event type="APPLICATION" 
            description="Event is fired when boat type is changed in the BoatSearchForm component" >
    <aura:attribute name="boatTypeId" type="String" />

Sender Component Register:

<aura:registerEvent name="appEvent" type="c:BoatTypeSelection"/>

Sender Component Controller:

"handleTypeChange" : function (component, event, helper) {

        console.log("Boat Type Changed");
        var boatSelectId = component.find("btselect").get("v.value");       
        if(boatSelectId.length > 0){
            console.log("Boat Type Changed to a specific type");
        } else {
            console.log("Boat Type Changed to all");
        var appEvent = $A.get("e.c:BoatTypeSelection");
        appEvent.setParams({"boatTypeId" : boatSelectId});
        console.log("Boat-Type-Change Event Fired");

Logs from Sender Component Controller:

enter image description here

Notice that console.log("Boat-Type-Change Event Fired"); never executes.

Receiver Component Handler:

<aura:handler event="c:BoatTypeSelection" action="{!c.handleBoatTypeSelection}" />

Receiver Component Controller:

"handleBoatTypeSelection" : function(component, event, helper) {
        helper.onSearch(component, event);

Receiver Component Helper:

"onSearch" : function(component, event) {
        var boatTypeId = event.getparam('boatTypeId'); 
        var action = component.get("c.getBoats");
        action.setParams({ boatTypeId : boatTypeId });
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                if(response.getReturnValue() != null){
                    component.set("v.boats", response.getReturnValue());
                } else {
                    component.set("v.noBoatsFound", true);
            else if (state === "INCOMPLETE") {
                // do something
            else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        console.log("Error message: " + 
                } else {
                    console.log("Unknown error");


enter image description here


  • 3
    getparam is not a function. it is getParam. Javascript is case sensitive unlike apex – TemporaryFix Oct 3 '18 at 19:34

JavaScript is case sensitive. The correct method name is "getParam", not "getparam." Note that, since you're getting this error, that means that your event is indeed firing. Also, once you've registered an event, you can also get it from your component by name:

var appEvent = component.getEvent("appEvent");

Again, everything here is case sensitive, so pay attention to the documentation carefully.

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.