从 KendoUI TreeView 获取当前数据 [英] Getting Current Data from KendoUI TreeView

问题描述

我正在使用带有来自 JSON 文件的远程数据源的剑道 UI 树.我在树页面上有一个按钮，它获取树的当前数据，通过 POST 将其发送到服务器，服务器将当前数据保存到 JSON 文件，以便下次我重新加载页面时，我所做的更改将被保留.这就是我想要发生的事情.

I'm using a kendo UI tree with a remote data source from a JSON file. I have a button on the tree page which gets the current data of the tree,sends it through a POST to a server and the server saves the current data to the JSON file so as the next time I reload the page,the changes I made will be kept.That's what I want to happen.

所以我知道树的当前数据在:

So I know the current data of the tree is in:

$("#treeview").data("kendoTreeView").dataSource.data()

这意味着数据在那里实时变化，例如当有人拖放树的节点时.

Which means the data changes real time in there for example when someone drag and drops a node of the tree.

当我在树内拖放节点时这些数据似乎没有改变时，我的问题就开始了，只有当我在树的根级别上拖放一个节点时才会改变，即使这样它也不会改变正确的是，因为节点也应该移到那里，但是节点被复制，也将过去的节点留在树中......

My problem starts when this data doesn't seem to change when I drag and drop nodes inside the tree,and only changes when I drag and drop a node on the root level of the tree and even then it doesn't do it correcly as the node should be moved in there as well but instead the node gets copied,leaving the past node in the tree as well...

例如我有这棵树:

如果我像这样进行拖放更改:

If I make a drag and drop change like this:

我发送数据，保存并重新加载更改根本没有进行！

And I send the data,save it and reload the change isn't made at all!

PS:即使我在发送之前查看更改后的当前数据，我也看到数据根本没有变化，即使我通过拖放进行了可视化更改.所以它没有与发送、保存和服务器有关.

PS:Even when I view the current data after the change before sending it,I see that there is no change on the data at all even though I did a change visualy with a drag and drop.So it doesn't have to do with the sending,saving and the server.

另一方面，如果我做出这样的改变:

On the other hand,if I make a change like this:

我可以在当前数据中看到移动的节点确实添加到了数据的末尾，但它并没有从数据中的初始位置删除！因此，如果我将当前数据发送到服务器，请将其保存并然后刷新我得到结果:

I can see in the current data that the moved node is added in the end of the data indeed but it is not deleted from it's initial position within the data!So if i send the current data to the server,save it and then refresh I get the result:

查看和发送数据的代码是:

The code for viewing and sending the data is:

function sendData() {
            var req = createRequest();
            var putUrl = "rest/hello/treeData";
            req.open("post", putUrl, true);
            req.setRequestHeader("Content-type","application/json");
            var dsdata = $("#treeview").data("kendoTreeView").dataSource.data();
            alert(JSON.stringify(dsdata));
            req.send(JSON.stringify(dsdata));

            req.onreadystatechange = function() {
                if (req.readyState != 4) {
                    return;
                }
                if (req.status != 200) {
                    alert("Error: " + req.status);
                    return;
                }
                alert("Sent Data Status: " + req.responseText);
            }
        }

这是一个错误还是我做错了什么?有没有人能够在每次拖放时看到当前数据正确变化?

Is this a Bug or am I doing something wrong?Has anyone been able to see the current data changing correctly on every drag and drop?

推荐答案

首先，也是最重要的，你必须使用最新版本的 KendoUI (Kendo UI Beta v2012.3.1024) 仍然处于测试阶段，但他们已经解决了许多问题.

First and most important you have to use the latest version of KendoUI (Kendo UI Beta v2012.3.1024) still in beta but is where they have solved many problems.

然后，当您创建 kendoTreeView 时，您必须这样说:

Then, when you create the kendoTreeView you have to say something like:

    tree = $("#treeview").kendoTreeView({
        dataSource :kendo.observableHierarchy(data),
        dragAndDrop:true
    }).data("kendoTreeView");

这里重要的是不是直接使用数据数组，而是用kendo.observableHierarchy包裹它.

Here the important is not using directly data array but wrapping it with kendo.observableHierarchy.

然后您将使用拖放结果更新数据滴.

Then you will have the data updated with the result of drag & drops.

这篇关于从 KendoUI TreeView 获取当前数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！