自动滚动kendo Treeview以编程方式选择一个节点

时间:2014-02-21 12:38:39

标签: jquery kendo-ui kendo-treeview browser-scrollbars

我是kendo treeView的新手。我们是否可以自动滚动树视图以获取当前视口中的节点。我创建了一个示例来展示问题JSBin Sample

1 个答案:

答案 0 :(得分:6)

我不确定treeView是否有该选项,但你可以为“select”事件创建一个事件处理程序,然后自己处理滚动。

var treeview = $("#tree").kendoTreeView({
  select: function(e) {
    var eleTop = $(e.node).offset().top;
    var treeScrollTop = $("#tree").scrollTop();
    var treeTop = $("#tree").offset().top;
    $("#tree").animate({
      scrollTop: (treeScrollTop + eleTop) - treeTop
    });
  },
  dataSource:[
    { expanded:true, text: "Furniture", items: [
      { text: "Tables & Chairs" },
      { text: "Sofas" },
      { text: "Occasional Furniture" }
    ] },
    { expanded:true, text: "Decor", items: [
      { text: "Bed Linen" },
      { text: "Curtains & Blinds" },
      { text: "Carpets" }
    ] }
  ]    

});
var treeview = $("#tree").data("kendoTreeView");
// find the node with text "foo"
var decor = treeview.findByText("Decor");
treeview.select(decor);
treeview.trigger("select", {node: decor});

注意:当您使用treeview api选择节点时,事件不会触发,因此我通过触发器自行触发它。我在你的垃圾箱里测试了它,它运行得相当好。调整它以获得所需的结果。