Webix JavaScript Query Review

Webix JavaScript UI library
3 min readOct 6, 2023

--

Webix JavaScript Query is a modern tool for filtering big datasets. The laconic design with a user-friendly interface helps you to manage your data tables at lightning speed. This solution is successfully applied in the proprietary Webix projects.

Features Overview

Filtering

The widget is intended to filter the information using a set of particular conditions. Depending on the data type being filtered, the conditions may be different. In this way, you can easily and quickly create, edit, group and delete filters according to your demands.

There is a “simple mode” of filtering as well. In this case, you may only create and delete filters, while editing and grouping will be restricted.

Grouping and Combining

You can create filter groups and nest them into each other to define more precise search conditions.

When you create several filters or their groups, the widget will set linking conditions “AND” or “OR” between them. The condition “AND” will consider both filters, while “OR” will take any of them.

Data processing

JS Query is capable of processing data on the client-side, using the built-in API, as well as on the server-side.

For integration with the server-side, Webix Query is shipped with ready-to-use backend solutions (Go, Node.js). Server scripts can generate SQL queries according to your filter configurations.

Display modes

The concise design of JS Query is created for convenient integration with your application, using a minimum screen space. For this purpose, the widget provides horizontal (Topbar) and vertical (Sidebar) modes of positioning.

JS Query functionality doesn’t depend on the placement. These modes are used in different cases. You can use the vertical mode if you work with large datasets. In this case, the filters will be displayed as a list. The horizontal positioning is more suitable for working with small data so that the filters can be placed in a row.

JavaScript Query live demo

Implementation

Webix Query is developed on the base of the Webix Filter widget. Any filter created in the application is a JS Filter widget. In this way, the filtering process is not limited to a single parameter and considers many conditions.

JS Query is integrated into one of our best projects, Webix Report Manager. In this application, the Query widget implements data filtering in the report generation process.

Ways to use

Webix JavaScript Query is a valuable tool for any developer who needs to work with large datasets. It can be used in a variety of applications, such as data visualization, data mining, and business intelligence.

Here are some examples of how Webix JavaScript Query can be used:

  • To filter a data table to show only rows that meet certain criteria, such as customers who have made a purchase in the past month.
  • To generate a SQL query that can be used to retrieve data from a database based on a user-defined filter.
  • To create a complex filter that can be used to filter multiple data tables simultaneously.
  • To create a filter that can be used to dynamically filter a data table as the user interacts with it.

Conclusion

When using JS Query, the data filtering process won’t be a problem for you anymore. You don’t need to reinvent the wheel. Appreciate your time and use it for more rewarding things. We did our best to solve this task quickly and efficiently, while the integration of the Query into your application is as simple as possible.

--

--

Webix JavaScript UI library

#JavaScript UI library for #cross-platform #web app development with 100+ #UI widgets and fully-featured #CSS / #HTML5 JavaScript controls. www.webix.com