Skip to main content

Server Side Filtering

In this tutorial we will show you an example of how you can create a dropdown that uses server side filtering to show values.

basic
For server side filtering to work, your API needs to support this, because the search term in the dropdown will be bound to the API call to show results.

Preparing the API Call​

First we have to prepare our API call.

In this example we are using our terminology adapter API, which supports the parameter match, which specifies how the matching fields will look like and more importantly the parameter matchvalue, that will filter the results to those containing the specified value, in our case either in the code or description.

After we set the parameters we bind them to values, the matchvalue parameter will be bound to the select field searchInput. As this has no value in the editor, we need to add test data to initialise the API. We do this by providing a test value that will return some result in the API.

See the video below for more details.

Preparing the Field​

On the select field we must add a datasource that points to our API and a dependency that will refresh our data every time we change the searchInput text, so that we will have refreshed results while we type.

You can see how to do this in the video below.

Usage​

Now that we have everything set up, let's go to the preview and see it in action. If you open up the developer tools and check the network, you can also see the individual calls being made with the specified parameters.