Custom Picklist component with search feature and both single select and multi-select Picklist
![Deploy to Salesforce](https://raw.githubusercontent.com/afawcett/githubsfdeploy/master/src/main/webapp/resources/img/deploy.png)
Demo : https://www.screencast.com/t/XuBGqkQJm
- Support Single Select
- Support Multiselect
- Searching
- Help Text
Attribute | Type | Description |
---|---|---|
label | String | Field Label |
value | String | Selected Value, format will be A;B;C in multiselect |
optionsList | List | List of Object with 2 attributes label and value, eg. [{"label":"Agriculture", "value":"Agriculture"},{"label":"Banking", "value":"Banking"}] |
required | Boolean | Show required * on UI, you have to add validation separately. |
helptext | String | Help text to be displayed |
multiselect | Boolean | Make this a multiselect picklist |
showLabel | Boolean | Make label visible on UI |
- Single Select
<c:AdvancePicklist helptext="Please fill in this field as this is required field."
label="{!v.ObjectType.Account.Industry.label}"
value="{!v.record.Industry}"
optionsList="{!v.ObjectType.Account.Industry.picklistOptions}"
></c:AdvancePicklist>
- Multi Select
<c:AdvancePicklist required="true"
helptext="Please fill in this field as this is a required field."
label="{!v.ObjectType.Account.Industry.label}"
value="{!v.record.Industry}"
multiselect="true"
optionsList="{!v.ObjectType.Account.Industry.picklistOptions}"
></c:AdvancePicklist>
- To clear the value in picklist give AdvancePicklist component an aura:id say "advPicklistId",
<c:AdvancePicklist aura:id="advPicklistId"
label="{!v.ObjectType.Account.Industry.label}"
value="{!v.record.Industry}"
optionsList="{!v.ObjectType.Account.Industry.picklistOptions}"
></c:AdvancePicklist>
In parent component controller, execute this command and it will reset the picklist.
let childPicklistCmp = component.find("advPicklistId");
if (childPicklistCmp) {
let auraMethodResult = childCmp.clearPicklist();
}