Skip to content

Instantly share code, notes, and snippets.

@brianmfear
Created September 18, 2018 16:50
Show Gist options
  • Save brianmfear/364d451ec5aaf33fb2f50705e1babc2f to your computer and use it in GitHub Desktop.
Save brianmfear/364d451ec5aaf33fb2f50705e1babc2f to your computer and use it in GitHub Desktop.
Disable button when all select options selected (Lightning)
<aura:application >
<aura:attribute name="opts" type="String[]" default="['A','B','C']" />
<aura:attribute name="disableButton" type="Boolean" default="false" />
<select aura:id="picklist" onchange="{!c.updateButtonState}" multiple="multiple">
<aura:iteration items="{!v.opts}" var="opt">
<option value="{!opt}">{!opt}</option>
</aura:iteration>
</select>
<lightning:button label="Test Button" disabled="{!v.disableButton}" />
</aura:application>
({
updateButtonState: function(component, event, helper) {
// Get the select options
let items = component.find("picklist").getElement().options;
// Set to disabled when all options selected
component.set("v.disableButton", Array.prototype.every.call(items, option => option.selected));
// NOTE: This code also re-enables button when one item is deselected.
// If not desirable, you will need to slightly modify this code.
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment