This is where things get a little trickier. We need to come up with a simple but powerful UI that provides suitable filter controls for each of our server-side filter parameters. Most of these are lists of string values concatenated with the pipe character, for which we can simply display a list or grid containing the available options that the users can click on to select. However, we also have a couple of numeric filters accepting a min/max value for each. It would be nice to include some kind of slider control for these range-based inputs. Finally, we need a way of clearing the selected filters.
The following screenshot is what we are aiming to build:
Each filter will be in an accordion section so that the user can collapse them to save space, and the results panel should update in real time as they change their filters...