Adding searchable drop-down
Simply following steps to add searchable drop-down ui component in a form
1. Add element in form xml
<field name="rateselection" component="Vasan_Bidding/js/form/components/rate-select" formElement="select">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filterOptions" xsi:type="boolean">true</item>
<item name="multiple" xsi:type="boolean">false</item>
<item name="showCheckbox" xsi:type="boolean">true</item>
<item name="disableLabel" xsi:type="boolean">true</item>
</item>
</argument>
<settings>
<required>true</required>
<!-- <validation>-->
<!-- <rule name="required-entry" xsi:type="boolean">true</rule>-->
<!-- </validation>-->
<elementTmpl>ui/grid/filters/elements/ui-select</elementTmpl>
<label translate="true">Select Rate</label>
<dataScope>rateselection</dataScope>
<componentType>field</componentType>
<listens>
<link name="${ $.namespace }.${ $.namespace }:responseData">setParsed</link>
</listens>
</settings>
<formElements>
<select>
<settings>
<options class="Vasan\Bidding\Model\Stone\Config\Source\Rates"/>
</settings>
</select>
</formElements>
</field>
Posted by vasan to vasan's deck (2022-04-05 17:11)