Slickgrid树视图

问题描述 投票:0回答:1

我是UI开发的新手。我正在开发一个已经使用slickgrid显示报告的项目。我的项目使用SlickGrid v1.4。我想修改当前报告并在报告中实现树视图。我将每个元素的父元素从后端传递给UI。

问题:

  1. 我是否需要将slickgrid升级到其最新版本。如果是,那么它是向后兼容的吗?
  2. 如何在slickgrid中实现此父子关系,比如我将使用哪些属性?

如果您需要更多详细信息,请与我们联系。

谢谢

slickgrid
1个回答
1
投票

如果你指的是javascript slickgrid,那么你需要专门看看这个slickgrid https://github.com/mleibman/SlickGrid/blob/gh-pages/examples/example5-collapsing.html的例子

这是一个实现而不是一个功能,所以任何版本都应该没问题。所以,如果可能的话,更好的是最新的。

它只是使用缩进的树视图的实现。它与其他具有树结构特定视图的库不同。

你应该在后端做什么,发送一个包含项目列表的数组到前端。数据项应具有父级和级别的2个属性。如果某个项是某个父项的子项,则父项对于root和级别0将为null。子级别为1,父级为0(数组索引)。 (在slickgrid中实现)请注意父值可以是基于您的数据的任何值。例如,类别的层次结构。

var item1 = {id: "id_1", category:"cat1" parent: null, }
var item2 = {id: "id_2", parent: "cat1"};

因此,level属性显示层次结构中当前项的深度。

示例中的光滑网格使用级别值来放置缩进或空格。

您可以使用相同的逻辑,也可以根据级别应用特定的css3类,并根据您的需要进行自定义。

.class[level=0] {}

所以光滑的网格是这样灵活的。您只需要特定格式的数据。

一个重要的事情是应该已经按字段和级别对项目数组进行排序以使其起作用。

像Oracle这样的某些数据库在以这种格式获取数据之前已经为您提供了诸如connect之类的选项。有一个保留的关键字级别,可以添加为列名。此外,假设您的表已经设计为表示层次结构的方式。

SELECT category_id, cat_name, cat_parent_id, LEVEL
FROM categories
CONNECT BY PRIOR category_id = cat_parent_id;

您还可以从指定的根目录中获取数据

START WITH category_id = 5
© www.soinside.com 2019 - 2024. All rights reserved.