Таблицы в вебе — sticky, inline‑редактирование и экспорт

Мы — веб-студия Фрейм. Ниже — прикладная методика по теме.

Когда использовать таблицу

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

Sticky шапка и колонки

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

Inline‑редактирование

Два клика — изменить — Enter. Маски и валидация на месте, ошибки без сдвига верстки. Сохранение — с индикатором статуса и повтором при проблемах сети. Конфликты версий решаем диффом или мягким мержем полей.

Массовые действия

Панель появляется над таблицей, когда выбрана хотя бы одна строка. Подтверждаем опасные операции, показываем счетчик затронутых объектов и итоговый отчет. Добавляем «выбрать все N» и «снять выбор», синхронизируем состояния чекбоксов с пагинацией.

Экспорт/Импорт

Экспорт с учетом активных фильтров/сортировок. Для больших наборов — асинхронная выгрузка с уведомлением. Импорт — через шаблон, предварительная проверка, аккуратная обработка ошибок и частичный откат. Даты/числа — в человекочитаемых форматах, кодировка — UTF‑8.