Строки подключения узла дерева Jqgrid для отображения родительского дочернего соединения

Question

Я использую Jqgrid Treegrid для отображения некоторых иерархических данных. Я столкнулся с двумя различными реализациями дерева, имеющими функцию отображения ссылки parent-child через некоторые строки, связанные с узлами. Одна такая реализация является библиотекой Jquery Jeasyui, вы можете найти его here

Вторая несколько похожа реализация Tabelizer - here

Теперь вопрос в том, как мы можем реализовать эту функцию в Jqgrid TreeGrid?

В начале каждой строки есть div с классом = "tree-wrap tree-wrap-ltr", каждый уровень которого имеет стиль = "width: 18px;" и продолжает добавлять 18px на каждом уровне.

Means level 0 style=width:18px 
levle 1 style=width:36px 
level 2 style=width:54px 

и так далее

Я думал, может быть какой-то ловкий Js цикл может пройти через каждый DIV и добавить некоторые границы атрибут, который в свою очередь может быть виден как разъемы уровня. Уловкой является проверка, когда узел является последним потомком, и когда узел ниже является родным братом, позволяя параллельным параллельным потокам нескольких строк.

Любые лучшие идеи?

Answer 1

jqGrid использует left свойство div со значком (или right в случае использования direction: "rtl") для размещения значка перед элементами TreeGrid. Ширина каждого уровня составляет 18 пикселей, см. the part of code. Поэтому я не вижу простой способ для реализации ваших требований.

Вы можете попробовать разместить дополнительные <div> или получить фоновое изображение с соответствующей левой позицией, чтобы иметь внешний вид, который вам нужен, но это будет непросто. Понятно, что нужно будет изменить значки/изображение при расширении/свертывании строк. К сожалению, jqGrid не предоставляет никаких дополнительных обратных вызовов/событий в случае расширения/свертывания. Поэтому нужно «подклассировать» методы. См. the answer для соответствующего примера кода. В любом случае выполнение требуемого поведения будет непростым, и я не рекомендую вам начинать делать это, если это не важно для ваших проектов.