Привет всем!
Я работаю над проектом, где нужно реализовать перетаскивание ячеек в HTML таблице. Вот что мне нужно:
- Возможность перетаскивать ячейки разной ширины (с разным colspan)
- Когда ячейку бросают в середину другой, более широкой ячейки:
- Должна создаваться новая ячейка такой же ширины, как перетаскиваемая
- Ячейки слева и справа от новой должны автоматически подстраивать свою ширину
Я пробовал использовать плагин jQuery для drag-and-drop, но столкнулся с проблемами при манипуляции DOM-элементами в месте, куда бросают ячейку.
Может кто-нибудь посоветовать библиотеку, где уже реализовано такое поведение? Или подсказать, как лучше подойти к решению этой задачи?
Буду благодарен за любые идеи!
Слушай, а ты не пробовал использовать gridstack.js? Это мощная библиотека для создания динамических сеток. Она поддерживает перетаскивание элементов разной ширины и автоматически подстраивает соседние ячейки. Правда, придется немного поколдовать с настройками, чтобы адаптировать под таблицу. Зато функционал богатый и документация хорошая. Может, это то, что тебе нужно?
Для такой задачи я бы посоветовал использовать библиотеку ag-Grid. Она предлагает мощный функционал для работы с таблицами, включая перетаскивание ячеек с colspan. Ключевые преимущества – встроенная поддержка drag-and-drop, автоматическая настройка размеров соседних ячеек и подробная документация с примерами. Минус в том, что ag-Grid довольно тяжеловесная, так что если нужен более легкий вариант, можно рассмотреть Sortable.js. Это значительно ускорит разработку.