Droptables : таблица Droptables

1. Форматировать в таблице

На панели инструментов вы можете установить стиль для ячейки, например: шрифт, размер шрифта, стиль текста, цвет фона для ячейки, цвет текста, горизонтальное и вертикальное выравнивание ячейки... Его можно применить к одной ячейке или нескольким ячейкам.

Высоту строки и ширину столбца можно определить в пикселях. Откройте «Формат меню» > «Применить размер столбца/строки» , затем выберите «Изменить размер столбца/Изменить размер строки» . Во всплывающем окне вы можете выбрать диапазон и установить пиксели для столбцов или строк. Нажмите «Готово» , чтобы закончить.

2. Тема и параметры сортировки

В каждой таблице вы можете найти опцию выбора темы в меню Тема . Просто щелкните тему, чтобы применить ее.

Если в вашей таблице уже есть данные и вы применяете тему, все данные будут удалены. Если вы примените тему к новой таблице, будут добавлены примеры данных и стиль, которые можно будет редактировать.

В той же теме меню > Альтернативные цвета функция «Автоматическое оформление» позволяет раскрасить строку в таблице с помощью верхнего и нижнего колонтитула . Вы можете выбрать стили шаблона или создать свои собственные в настройках плагина.

Параметр sortable позволяет вам выполнять сортировку данных AJAX во внешнем интерфейсе. Вы можете увидеть это в меню «Формат» > «Сортировка» .

Выравнивание таблицы заключается в выравнивании элемента div, содержащего всю таблицу, например, по центру всей таблицы. Вы можете найти в меню «Формат» > «Выравнивание таблицы» .

Выделение ячейки также доступно в качестве опции. Вы можете включить в конфигурации параметры «Линия», «Столбец» или «Оба» . По умолчанию он отключен. Вы можете настроить цвет и непрозрачность выделения.

Также доступна всплывающая подсказка при наведении курсора мыши на ячейку (ее необходимо активировать в параметрах компонента). В каждой ячейке таблицы вы можете увидеть параметр всплывающей подсказки, щелкнув ее правой кнопкой мыши.

Вы можете установить ширину подсказки в пикселях. Вы увидите всплывающую подсказку с редактором для редактирования.

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

4. ACL и администрирование внешнего интерфейса

Вы можете управлять своими таблицами из интерфейса Joomla. В диспетчере меню Joomla добавьте пункт «Новое меню», выберите тип « Управление таблицами» и выберите « Droptables - По умолчанию» в качестве шаблона.

Вот что вы можете увидеть в Droptables Manager из Droptables интерфейса.

Примечание. Чтобы отобразить интерфейс диспетчера таблиц в полноэкранном режиме во Droptables интерфейсе, выберите « Стиль шаблона»> « Droptables интерфейс Droptables .

Вы можете использовать ACL группы пользователей Joomla для управления действиями по редактированию таблиц. Во-первых, чтобы настроить, кому разрешено просматривать таблицы, вы должны перейти на «Роли пользователей» в Droptables .

Вы можете установить владельца таблицы в меню «Таблица» > «Доступ к таблице».

5. Замораживание строк и столбцов

Колонка замораживания

Заморозка колонки доступна в меню « Формат» > «Параметры адаптивности» . Вы можете заморозить до 5 столбцов. Счет ведется с первого столбца.

Чтобы заморозить столбец / строку, есть дополнительная опция, которая позволяет вам фиксировать высоту таблицы (поскольку ваш контейнер таблицы может иметь бесконечную высоту).

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

Замораживание строк

Вы можете найти его в «Формат меню» > «Заголовок таблицы» , отсюда вы можете включить опцию и установить закрепление строк (до 5 строк).

Если вы хотите установить высоту таблицы, вернитесь к параметрам адаптивности.

Тогда первая строка будет заморожена во внешнем интерфейсе в соответствии с настройками.

6. Фильтрация данных столбца

Параметр фильтрации доступен в меню «Формат» > «Фильтры» . Вы можете активировать его, нажав, чтобы включить поля фильтрации общедоступных данных.

Пример фильтров:

7. Заполнение ячеек и радиус границы.

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

8. Пользовательский CSS

Давайте сделаем еще один шаг вперед. Если вы веб-дизайнер с навыками редактирования CSS, вы сможете добавить CSS в меню «Формат меню» > «Пользовательский CSS» .

Ячейки, строки и столбцы имеют координаты, позволяющие идентифицировать каждую из них и применять к ним собственный CSS. R — строка, C — столбец. Здесь строка 1 (r1), столбец 4 (c4) = dtr1 dtc4

Код CSS раскрашен с помощью зеркального отображения кода. Код CSS может быть меньше кода, он тоже работает!

9. Адаптивные таблицы Joomla

Являются ли мои таблицы адаптивными или используют прокрутку на небольших устройствах?

Сокрытие Колов

Droptables обрабатывают адаптивный дизайн с помощью приоритетного инструмента, как вариант. По умолчанию адаптивная функция отключена, будет переполнение (хотя оно отлично работает на мобильных устройствах). Чтобы использовать «Скрытие столбцов» , перейдите в «Формат меню» > «Адаптивные параметры».

Адаптивный режим расширен, вы можете определить приоритет для скрытия столбцов на мобильных устройствах.
Когда столбцы скрыты, будет отображаться мобильное меню с флажком для принудительного отображения/скрытия столбцов. Размер столбца фиксируется при редактировании таблицы. Если размер всех столбцов слишком велик для контейнера, у вас будет переполнение, и вы сможете легко прокручивать на мобильных устройствах.

Таблица со свитком (лучше при небольшом количестве столбцов)

Таблица со скрытым столбцом (лучше для большого количества столбцов)

Повторяющийся заголовок

Это еще один вариант, если вы хотите вставить таблицу в небольшую область вашего сайта. Вам следует перейти в «Формат меню» > «Параметры адаптивности». Затем выберите «Адаптивный тип» > «Повторяющийся заголовок».

Будут варианты для настройки по вашему запросу:

Адаптивная точка останова (px): выберите значение точки останова в пикселях, чтобы определить, когда таблица переключится в этот адаптивный режим.
Адаптивная максимальная высота (пикселей): при активации адаптивного режима в зависимости от значения точки останова определите максимальную высоту, чтобы избежать очень длинной таблицы.
Стиль адаптивного режима: примените стиль по умолчанию для этого адаптивного режима или используйте цвета таблицы.

После этого вы сможете увидеть, как таблица будет выглядеть во внешнем интерфейсе.

10. Скачать таблицу

Чтобы поделиться своей таблицей с общественностью, перейдите в меню «Таблица» и отметьте «Экспортировать в Excel» . Тип файла будет *.xlsx при загрузке во внешнем интерфейсе.

11. Пагинация

Эту функцию можно найти в меню «Формат меню» > «Разбиение на страницы» в каждой редакции таблицы. Используйте кнопку переключения, чтобы включить и выбрать количество строк, отображаемых на странице.

12. Формат для отдельных ячеек.

Вы можете установить формат: дата, время, валюты, число для одной ячейки в Droptables . Сначала вам следует выбрать ячейку или несколько ячеек. Затем перейдите в «Формат меню» > «Дата и время».

После этого таким же образом можно сделать Валюту и Номер .

13. Распечатать таблицу на веб-интерфейсе

Иногда вам нужно распечатать таблицу. Поэтому, чтобы отобразить кнопку «Печать» на веб-интерфейсе, сначала вам следует перейти к таблице меню и отметить опцию « Кнопка печати»