Здравствуйте. Мне нужна возможность перемещать элементы в DataView в разные (не по порядку) ячейки таблицы (т.е. чтобы n элементов не сортировались автоматически по первым n ячейкам). Возможно ли это?
Здравствуйте, Spanden,
Базовый режим drag: true позволяет и добавлять новые элементы, и перемещать новые/существующие на любую позицию.
Что касается:
чтобы n элементов не сортировались автоматически по первым n ячейкам
могли бы вы уточнить, как это должно выглядеть и какой результат вы хотите?
Посмотрите, пожалуйста, пример базовой работы drag: true: Code Snippet
например, если я уберу элемент из первой ячейки, то эта (первая) ячейка должна стать пустой, а остальные элементы должны остаться на своих местах.
Здравствуйте, Spanden
В dataview нельзя оставить полностью пустое место между элементами, но можно добавлять “пустые” элементы.
Это всё ещё полноценные элементы данных (хранятся в store внутри компонента), но при наличии кастомного поля (например, $empty ) их можно выделять и блокировать взаимодействие с ними.
Чтобы реализовать возможность оставлять пустые ячейки при перетаскивании, нужно использовать события onBeforeDropOut, onBeforeDrop, onBeforeDrag.
Событие onBeforeDropOut отслеживает момент перетаскивания элемента за пределы своего компонента. В его обработчике мы получаем индекс элемента, который перетаскиваем, чтобы добавить на место этого элемента новый пустой объект:
const index = this.getIndexById(ctx.source[0])
this.add({ id: webix.uid(), $empty: true }, index);
В обработчике onBeforeDrop перед тем, как элемент помещён на цель перетаскивания, надо проверить, пустой ли элемент. И если элемент пустой, нужно удалить его.
В обработчике onBeforeDrop мы отменяем способность перетаскивания элемента, если он пустой (return false):
const item = this.getItem(ctx.source[0])
if(item.$empty) {
return false
}
Посмотрите, пожалуйста, пример реализации пустых ячеек: Code Snippet
1 Like
спасибо. Думаю, такой вариант годится.