Skip to content
Snippets Groups Projects
Solid-Form-Search.rst 2.16 KiB

solid-form-search

Allows you to filter the contents of a component that uses the filter-mixin such as solid-display or solid-map. This must have a filtered-by attribute set to the id of the current solid-form-search.

<solid-form-search
   id="my-filter"
   fields="email"
   label-email="search by email"
></solid-form-search>

<solid-display
   data-src="http://example.com/users"
   fields="username, last_name, email"
   filtered-by="my-filter"
></solid-display>

Mixins

This component uses the following mixins:

Please check their documentation to know more about their capabilities.

Attributes

fields

List of fields used to perform the search.

label-xyz

When displaying a form, the default labels are the fields names of the model. If you want something fancier, you can set this attribute. i.e. label-username="Your name"

submit-button

Text of the submit button to create in the search form. If the attribute is not defined, no button will be added and the form will trigger the search on change.

range-xyz

URL of a container which list the accepted values for the field xyz. It’s particularly useful with a dropdown field.

enum-xyz

List of values of your choice for the field xyz. They have to be filled manually and must be separated by commas. It’s particularly useful with a dropdown or radio field.

Two formats are possible:
  • enum-xyz="value1, value2, value3" : each value will be displayed

and loaded in value attribute

  • enum-xyz="value1 = a, value2 = b, value3 = c": each value will be displayed

and "a", "b", "c" will be loaded in value attribute.

Widgets

By default, the widget used is <solid-form-label-text>. Cf the Widget Form page for more info.

Events

formChange

Triggered when the form values change