UI виджет DataView

DataView - это клиентский JavaScript виджет, который отображает данные привлекательным и понятным образом. Виджет сохраняет высокую производительность даже при загрузке больших данных.

живое демо

  • Интеграция: jQuery, Angular, React, Vue.js, Backbone
  • Примеры интеграции с PHP, Node.js и .NET
  • Поддерживается во всех браузерах (IE8+)
  • Работает на устройствах с сенсорным экраном
  • Соответствует требованиям Секции 508
  • Удобная стилизация с помощью CSS

Группировка в DataView

С помощью виджета DataView вы можете рационально группировать данные внутри контейнера. Благодаря группировке, вам не придется искать нужную информацию среди тысяч одинаковых записей. Просто сгруппируйте данные удобным для вас образом - и вы быстро найдете нужную запись.

Нажмите на одну из кнопок, чтобы сгруппировать данные

Добавление и удаление элементов

Вы можете легко и интуитивно добавлять новые данные. Чтобы добавить новый элемент в виджет DataView, можно использовать форму. После ввода всех необходимых данных, нажав на кнопку, пользователь увидит новый элемент в DataView. Вы можете выделять один или несколько элементов. Также вы можете удалять элементы из DataView.

Добавьте новый фильм

Динамическая загрузка данных

Благодаря динамической загрузке, загружается только та информация, которая нужна на данный момент. Динамическая загрузка значительно снижает нагрузку на сервер.

Динамическая загрузка

Удобная сортировка и фильтрация данных

Библиотека Webix отлично справляется с сортировкой данных и позволяет визуализировать, организовывать и понимать данные с первого взгяда. Благодаря функции фильтрации JavaScript виджета DataView, вы можете отображать только необходимые данные.

Пейджинг

Добавив пейджер к DataView, вы поможете пользователям программы быстро переходить от одной группы данных к другой с помощью кнопок навигации.

Выделение элементов

Вы можете выделять элементы данных в виджете различными способами: любой элемент, первый элемент, последний элемент или сразу все элементы.

Редактирование данных

Вы можете с легкостью редактировать данные в DataView по клику на ячейки.

Кликните по любой ячейке, чтобы изменить ее содержимое

Drag-and-drop

Вы можете перетаскивать элементы внутри DataView и между DataView и другими виджетами, например, JavaScript Tree, Datatable, TreeTable.

Перетащите элементы из одного виджета в другой

Изображения

Вы можете добавлять изображения в элементы DataView.