Multiple Checkboxex with default as true
toggle_smle_app.app
<aura:application extends="force:slds">
<aura:attribute name="allaccounts" type="List" default="[ { BillingCity: 'Denver' }, { BillingCity: 'Ontario' }, { BillingCity: 'San Francisco' } ]" />
<aura:attribute name="selectedCities" type="List" default="[]" />
<aura:iteration var="a" items="{!v.allaccounts}" indexVar="indx">
<ui:inputCheckbox aura:id="checkbox"
value="true" text="{!a.BillingCity}"
name="{!indx}"
label="{!a.BillingCity}"
change="{!c.selectoptionvalue}"/>
</aura:iteration>
<hr />
Selections: {!join(',',v.selectedCities)}
</aura:application>
({
selectoptionvalue: function(component, event, helper) {
var selected = [], checkboxes = component.find("checkbox");
if(!checkboxes) { // Find returns zero values when there's no items
checkboxes = [];
} else if(!checkboxes.length) { // Find returns a normal object with one item
checkboxes = [checkboxes];
}
checkboxes
.filter(checkbox => checkbox.get("v.value")) // Get only checked boxes
.forEach(checkbox => selected.push(checkbox.get("v.label"))); // And get the labels
component.set("v.selectedCities", selected); // Set to display
}
})
O/p
Selections: Denver,Ontario,San Francisco
Comments
Post a Comment