Multiselect with search option

[WalaZargouni]

Hello, i need a multiselect with a search functionality just like the one used in the Filter widget in Experience builder, i cannot find what i'm looking for in jimu-ui.

Can someone help ?

[JeffreyThompson2]

I think you are talking about FieldSelector. 

https://developers.arcgis.com/experience-builder/storybook/?path=/docs/components-jimu-ui-advanced-d...

Take a look in the advanced folder of the Storybook to see if you find what you want. There are several similar options.

[WalaZargouni]

It looks like the FieldSelector component yes, but with the FieldSelector it works only with a datasource and its fields. i need to load the items of the select with an api call

[TonghuiMing · Accepted solution]

@WalaZargouni The AdvancedSelect component is what you are looking for.

[JanSarata]

Hi @TonghuiMing, as far as I know, The AdvancedSelect is still missing the method onSearchInputChanged which is really important while using with API calls as @WalaZargouni mentioned. Are there any plans to implement this method? https://developers.arcgis.com/experience-builder/storybook/?path=/story/components-jimu-ui-index-ad...

[TonghuiMing · Accepted solution]

@JanSarata You are referring to https://community.esri.com/t5/arcgis-experience-builder-questions/experience-builder-advanced-select..., right? We will note that and see if we can implement it.

[WalaZargouni]

Yes apparently the AdvancedSelect is what i need, the dynamic data example code is not available in the storybook, i tried implementing it as the following 

<AdvancedSelect

                  onChange={function noRefCheck(){}}

                  staticValues={[

                    {

                      label: 'Label-1',

                      value: 1

                    },

                    {

                      label: 'Label-2',

                      value: 2

                    },

                    {

                      label: 'Label-3',

                      value: 3

                    }

                  ]}

                  isEmptyOptionHidden

                  isMultiple

                  hideBottomTools

                />
but the problem is that when i select a value nothing happens, you can see it in the attached GIF, is it a bug or am i missing something ? 

[JeffreyThompson2]

The onChange={function noRefCheck(){}} function does not do anything. You will need to write your own onChange function to handle the click event as needed.