Home / Autocomplete / Structured Filter
Structured Filter

Structured Filter

Download Demo
  • Overview
  • Documents
User Rating: 0/5 ( 0 votes)
Your Rating:

Structured Filter is a Web UI for building structured search queries. It is a full jQuery UI widget, supporting various configurations and themes. With it you can build structured search queries like "Contacts where Firstname starts with 'A' and Birthday after 1/1/1980 and State in (CA, NY, FL)"...


The widget is configured with a list of fields to use in the search conditions.


Each field must have an ID, a type and a label.

  • id - unique identifier for the field.
  • label - displayed field name.
  • type - data type. Possible types of field: text, number, boolean, date, time, list.


fields = [
    { type:"text", id:"lastname", label:"Lastname"},
    { type:"text", id:"firstname", label:"Firstname"},
    { type:"boolean", id:"active", label:"Is active"},
    { type:"number", id:"age", label:"Age"},
    { type:"date", id:"bday", label:"Birthday"},
    {type:"list", id:"category", label:"Category",
            {id:'1', label:"Family"},
            {id:'2', label:"Friends"},
            {id:'3', label:"Business"},
            {id:'4', label:"Acquaintances"},
            {id:'5', label:"Other"}


Queries are expressed as a set of conditions.

Each condition is defined by:

  • a field
  • an operator
  • one or several values

For each field the possible operators are determined by it's type.


  • Yes (1)
  • No (0)


  • on (eq)
  • not on (ne)
  • after (gt)
  • before (lt)
  • between (bw)
  • is empty (null)
  • is not empty (nn)


  • any of (in)
  • equal (eq)


  • = (eq)
  • != (ne)
  • > (gt)
  • < (lt)
  • is empty (null)
  • is not empty (nn)


  • equals (eq)
  • not equal (ne)
  • starts with (sw)
  • contains (ct)
  • finishes with (fw)
  • is empty (null)
  • is not empty (nn)


  • at (eq)
  • not at (ne)
  • after (gt)
  • before (lt)
  • between (bw)
  • is empty (null)
  • is not empty (nn)

Source: github.com

Scroll To Top