You need to sign in to do that
Don't have an account?
Luciano Roberto
Show all Toasts on the list
Folks,
I'm configuring the toast, where a list of alerts will be shown, but instead of showing multiple toasts, it is showing only the last one on the list. How do I resolve this issue?
Follow the code
TestAlert.cmp
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId,lightning:actionOverride,lightning:backgroundUtilityItem" access="GLOBAL" controller="AlertController"> <aura:attribute name="html" type="String" /> <aura:attribute name="showToast" type="boolean" default="false"/> <aura:attribute name="Alert" type="Alert__c" default="{'sobjectType': 'Alert__c', 'Tipo_de_Alerta__c': '', 'Name': '', 'Alerta1__c': '' }"/> <aura:handler name="init" value="{!this}" action="{!c.doInit}"/> <aura:if isTrue="{!v.showToast}"> <div class="demo-only" style="height: 4rem;"> <div class="slds-notify_container slds-is-relative"> <div aura:id="alerta" role="status"> <div class="slds-notify__content"> <h2 class="slds-text-heading_small "> <aura:unescapedHtml value="{!v.html}" /> </h2> <lightning:buttonIcon iconName="utility:close" variant="bare" alternativeText="Close" iconClass="{!v.type == 'warning' ? 'light' : 'dark'}" size="small" class="slds-button slds-button_icon slds-notify__close slds-button_icon-inverse" onclick="{!c.close}"/> </div> </div> </div> </div> </aura:if> </aura:component>
TestAlertController.js
({ doInit : function(component, event, helper) { var action = component.get( "c.getMsgs" ); action.setCallback(this, function(response) { var state = response.getState(); if(state == 'SUCCESS') { var alertMsgList = response.getReturnValue(); if(alertMsgList.length > 0) { component.set("v.showToast", true); var tipoAlerta = component.find( "alerta" ); $A.util.addClass( tipoAlerta, "slds-notify" ); $A.util.addClass( tipoAlerta, "slds-notify_toast" ); } for(var i = 0; i < alertMsgList.length; i ++) { var alerta = alertMsgList[ i ].Alerta1__c; var tipo = alertMsgList[ i ].Tipo_de_Alerta__c; var titulo = alertMsgList[ i ].Name; if (tipo == 'success') { // Successs $A.util.addClass( tipoAlerta, "slds-theme_success" ); component.set("v.html",alerta); } if (tipo == 'Info') { // Info $A.util.addClass( tipoAlerta, "slds-theme_info" ); component.set("v.html",alerta); } if (tipo == 'error') { // Error $A.util.addClass( tipoAlerta, "slds-theme_error" ); component.set("v.html",alerta); } if (tipo == 'warning') { // Warning $A.util.addClass( tipoAlerta, "slds-theme_warning" ); component.set("v.html",alerta); } } } else { console.log("Failed with state: " + state); } }); $A.enqueueAction(action); }, close: function(cmp, event, helper) { $A.util.addClass(cmp.find('alerta'), "slds-hide"); }, })
I was able to solve the following, I did not need to put the ID in the DIV, instead I put the class directly bringing the alert type formatting in it
My code looks like this, if someone needs to:
Component.cmp
Controller.js
All Answers
1 : Change your attribute to accept the list of HTML alter messages
<aura:attribute name="html" type="List" />
2. Create an array in JS controller and set the value to above attribute at the end
3. Use aura:iteration on the list collection ..
create an array like this
var alters = []
push all the alters in var
alters .push("Kiwi");
alters .push("Kiw1i");
alters .push("Kiwi2");
end set them in to the attribute
and in markup iterate it
I'm sorry Raj, but I'm still learning as a programmer, it would be asking a lot if you could change my code with this information you're passing me. I can not do it.
Please.
TestAlert.cmp
----------------------------------------------------------------
TestAlertController.js
----------------------------------------------------------------
TestAlertController.apxc
----------------------------------------------------------------
What I need is to check how many alerts are registered, to display them.
Alert_style__c
and use this code
You are concatenating alert messages in only one, when in fact you would have to show two alerts.
- Alert One
- Alert Two
O Codigo está assim atualmente:
TestAlert.cmp
TestAlertController.js
AlertController.apxc
Object with new field (Alert_Style__c)
I need you to display two alerts, same as those here.
If you have 3, show 3 and so on.
You need to check the number of registered alert records
https://developer.salesforce.com/docs/component-library/bundle/force:showToast/documentation
The alert must be by View, unfortunately. Requirement of my boss
I was able to do the aura iteration and it is showing the alerts as they should, however for each alert it needs to have its own aura: id to be able to modify its individual behavior, such as alert type and the close button.
Here's the code below:
I was able to solve the following, I did not need to put the ID in the DIV, instead I put the class directly bringing the alert type formatting in it
My code looks like this, if someone needs to:
Component.cmp
Controller.js