Как выбрать родственную ветку только для TreeView с помощью jQuery?

У меня есть многоуровневое древовидное представление с использованием KendoUI от Telerik, и я пытаюсь получить правильный идентификатор для ветви переупорядоченного узла.

    <ul id="root">
    <li>Item 1 (1)<input type="hidden" name="PresetItemId" value="1" />
        <ul>
            <li>Item 1.1 (5)<input type="hidden" name="PresetItemId" value="5" /></li>
            <li>Item 1.2 (6)<input type="hidden" name="PresetItemId" value="6" />
                <ul>
                    <li>Item 1.2.1 (11)<input type="hidden" name="PresetItemId" value="11" /></li>
                    <li>Item 1.2.2 (12)<input type="hidden" name="PresetItemId" value="12" /></li>
                </ul>
            </li>
        </ul>
    </li>
    <li>Item 2 (2)<input type="hidden" name="PresetItemId" value="2" />
        <ul>
            <li>Item 2.1 (7)<input type="hidden" name="PresetItemId" value="7" />
                <ul>
                    <li>Item 2.1.1 (13)<input type="hidden" name="PresetItemId" value="13" />
                        <ul>
                            <li>Item 2.1.1.1 (18)<input type="hidden" name="PresetItemId" value="18" /></li>
                        </ul>
                    </li>
                    <li>Item 2.1.2 (14)<input type="hidden" name="PresetItemId" value="14" /></li>
                </ul>
            </li>
            <li>Item 2.2 (8)<input type="hidden" name="PresetItemId" value="8" />
                <ul>
                    <li>Item 2.2.1 (15)<input type="hidden" name="PresetItemId" value="15" /></li>
                </ul>
            </li>
            <li>Item 2.3 (27)<input type="hidden" name="PresetItemId" value="27" /></li>
        </ul>
    </li>
    <li>Item 3 (3)<input type="hidden" name="PresetItemId" value="3" />
        <ul>
            <li>Item 3.1 (9)<input type="hidden" name="PresetItemId" value="9" />
                <ul>
                    <li>Item 3.1.1 (16)<input type="hidden" name="PresetItemId" value="16" /></li>
                </ul>
            </li>
            <li>Item 3.2 (10)<input type="hidden" name="PresetItemId" value="10" />
                <ul>
                    <li>Item.3.2.1 (23)<input type="hidden" name="PresetItemId" value="23" /></li>
                </ul>
            </li>
            <li>Item 3.3 (19)<input type="hidden" name="PresetItemId" value="19" />
                <ul>
                    <li>Item.3.3.1 (24)<input type="hidden" name="PresetItemId" value="24" /></li>
                </ul>
            </li>
            <li>Item 3.4 (20)<input type="hidden" name="PresetItemId" value="20" />
                <ul>
                    <li>Item.3.4.1 (25)<input type="hidden" name="PresetItemId" value="25" /></li>
                </ul>
            </li>
            <li>Item 3.5 (21)<input type="hidden" name="PresetItemId" value="21" />
                <ul>
                    <li>Item.3.5.1 (28)<input type="hidden" name="PresetItemId" value="28" /></li>
                </ul>
            </li>
            <li>Item 3.6 (22)<input type="hidden" name="PresetItemId" value="22" />
                <ul>
                    <li>Item.3.6.1 (26)<input type="hidden" name="PresetItemId" value="26" /></li>
                </ul>
            </li>
        </ul>
    </li>
    <li>Item 4 (4)<input type="hidden" name="PresetItemId" value="4" /></li>
</ul>

Я считаю, что каждый родительский элемент содержит дочерние элементы, и эти дочерние элементы упорядочиваются независимо от любой другой ветки в TreeView.

Поэтому мне нужно захватить всех братьев и сестер ветки, на которую падает узел, и получить идентификаторы только для этого уровня ветки, когда узел сортируется. Если у любого из этих узлов есть дочерние элементы, я не хочу, чтобы они были частью коллекции Id.

У меня он работает, в некоторой степени, но он возвращает всех братьев и сестер (что правильно), но также всех детей этих братьев и сестер (что неверно).

var treeview;

function onTreeViewDragEnd(e){
    var console = $("#console");
    //alert("source: " + treeview.text(e.sourceNode));
    //alert("destination: " + treeview.text(e.destinationNode));

    var list = $(e.destinationNode).siblings().not($(this).children());

    var data = $("input", list).serialize();
    console.html(JSON.stringify(data));
}


treeview = $("#root").kendoTreeView({
    dragAndDrop : true,
    dragend: onTreeViewDragEnd
}).data("kendoTreeView");

Я начал jsfiddle по этому поводу: http://jsfiddle.net/kahanu/PdaRg/1/ < / а>

Чтобы использовать этот пример, просто разверните узел, а затем перетащите его в другое место в той же ветке, и он отобразит скрытые входные значения для ветки (и дочерних элементов, чего я не хочу).

Любая помощь, указывающая мне в правильном направлении, приветствуется.

Спасибо.


person Kahanu    schedule 02.05.2012    source источник


Ответы (1)


Дело не в том, что вы извлекаете больше узлов, чем нужно, а в том, что вы ищете input на любом уровне ниже узлов.

var list = $(e.destinationNode).siblings();
var data = list.children("div").find("input").serialize();
person David Hedlund    schedule 02.05.2012
comment
Дэвид, спасибо, я понимаю, что ты имеешь в виду. Ваше решение намного ближе. Это возвращает почти правильные узлы (и значения). Отсутствует один узел, узел, перед которым я опускаю. Кроме того, что делает .children (div)? В дереве нет div. - person Kahanu; 03.05.2012
comment
Я нашел то, что мне нужно, с помощью Дэвида. Его код возвращал только узлы на этом уровне, что я и хотел, но он не возвращал все узлы на этом уровне. Какой бы узел я ни опускал, он не появится в моем списке. Я обнаружил, что .siblings () возвращает все узлы, кроме текущего узла. Я обнаружил, что переход к родительскому элементу и обратно к дочерним элементам выбирает все узлы на этом уровне. var list = $(e.destinationNode).parent().children(); <-- not .siblings() var data = list.children("div").find("input").serialize(); - person Kahanu; 03.05.2012
comment
Вы также можете сделать .siblings().andSelf(), который делает именно то, что вы просите. - person David Hedlund; 03.05.2012
comment
Ага, я только что попробовал, и вы правы. Хммм, думаю, этот мне больше нравится. Спасибо. - person Kahanu; 03.05.2012