+ Start a Discussion
Nithesh NNithesh N 

Toast Event not Firing and [Cannot read property 'setParams' of undefined] Error

Hey Everyone, 

I am having trouble displaying the Toast message, in a simple Lightning component, Following os the code.

Cmp
<aura:component implements="flexipage:availableForAllPageTypes" access="global">	

    <aura:attribute name="result" type="String" />
    
    <div aura:id="input" class="slds-box small" >
        <div aura:id="panelList">
            <header class="slds-m-bottom--small">
                <div class="slds-media slds-media--center slds-m-bottom--small">
                    <div class="slds-media__figure">
                        <lightning:icon iconName="utility:answer" />
                    </div>
                    <div class="slds-media__body">
                        <h2 class="slds-text-heading--small "> Text Analyzer </h2>
                    </div>
                </div>
                <div class="slds-form-element">
                    <label class="slds-form-element__label slds-assistive-text" for="searchBox">Search</label>
                    <div class="slds-form-element__control">
                        <ui:inputText aura:id="Text2Analyze" class="slds-input" placeholder="Enter any text..." change="{!c.updateSearch}"/>
                    </div>
                </div>
            </header>
        </div>
    </div>
    
</aura:component>

Controller.js
({
	updateSearch : function(component, event, helper) {
		var inputText = escape(component.find("Text2Analyze").get("v.value"));
        console.log(inputText.length);
        helper.toastThis(inputText.length, 'Input text Length')
	}
})

helper.js
({
	toastThis : function(message, title) {
        var toastEvent = $A.get("e.force:showToast");
        toastEvent.setParams({
            "title": title || "Error:",
            "message": message,
            "type": "error",
            "mode": "sticky"
        });
        toastEvent.fire();
    }
})

demo App
<aura:application extends="force:slds">
    <c:toastComponent />
</aura:application>

And This is the Error I am getting, when i tired to run it
Action failed: c:toastcomponent$controller$updateSearch [Cannot read property 'setParams' of undefined]
Failing descriptor: {c:toastcomponent$controller$updateSearch}


Please point out the mistakes i made. 

Best,
Nithesh
Best Answer chosen by Nithesh N
Nayana KNayana K
When you try to launch the component via app (demoApp in your case) , standard events (toast,  navigateToSobject,  etc)  will be undefined. 
var toastEvent = $A.get("e.force:showToast");


toastEvent will have "undefined " always. 

Therefore launch your toastComponent in LEX via app builder or lightning quickaction or drag to detail page to check how it works. 

All Answers

Nayana KNayana K
When you try to launch the component via app (demoApp in your case) , standard events (toast,  navigateToSobject,  etc)  will be undefined. 
var toastEvent = $A.get("e.force:showToast");


toastEvent will have "undefined " always. 

Therefore launch your toastComponent in LEX via app builder or lightning quickaction or drag to detail page to check how it works. 
This was selected as the best answer
Nithesh NNithesh N
Thanks Nayana...it works like a charm now.
Nayana KNayana K
Most Welcome :)
Alvin Bernard 1Alvin Bernard 1
How can we accomplish the same if we want to refresh the view on close of modal in Lightning App ? 
Suryadeep SinghSuryadeep Singh
Is there anyway to use toast in our demo app that we create on our developer console?
Siddhartha Ghosh 17Siddhartha Ghosh 17

Hi Nayana/Nitesh,

I am using the

var resultsToast =$A.get("e.force:showToast"); and adding the component in the detail page but still it simply is not functional.


Regards,
Siddhartha

Ranjith Raja 3Ranjith Raja 3
Thanks Nayana ..!