1

我有一个使用 Telerik 的 KendoUI 的多级树视图,我正在尝试为重新排序的节点的分支获取正确的 ID。

    <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。如果这些节点中的任何一个有孩子,我不希望孩子成为 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/

要使用此示例,只需展开一个节点,然后将其放在同一分支的其他位置,它将显示该分支的隐藏输入值(以及子节点,这不是我想要的)。

任何为我指明正确方向的帮助表示赞赏。

谢谢。

4

1 回答 1

1

并不是您获取的节点比您需要的多,而是您在input节点下方的任何级别进行搜索。

var list = $(e.destinationNode).siblings();
var data = list.children("div").find("input").serialize();
于 2012-05-02T20:25:39.550 回答