dhtmlxGantt使用教程：如何在 格的列中对数据进行排序

dhtmlxGantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表。可满足项目管理应用程序的所有需求，是最完善的甘特图图表库。它允许你创建动态甘特图，并以一个方便的图形化方式可视化项目进度。有了dhtmlxGantt，你可以显示活动之间的依赖关系，显示具有完成百分比阴影的当前任务状态以及组织活动到树结构。

dhtmlxGantt试用版

dhtmlxGantt允许您在 格的列中（在客户端上）对数据进行排序。

您可以通过2种方式在 格中进行排序：

1. 通过单击具有启用的sort属性的列的标题；
2. 通过API的排序方法调用（可以从某些事件或操作（即单击按钮或加载页面）中调用）。

请注意，甘特只能按数据中的值对任务进行排序，而不能对列的模板属性所设置的值进行排序。

通过单击标题进行排序

一旦用户单击标题，甘特图就会开始显示一个特殊控件，该控件指示表当前被排序的列以及排序的方向（升序或降序）。下次单击同一标题将反转排序方向。

gantt.config.sort = true;gantt.init("gantt_here");

程序化排序

要对某些操作或事件（即按钮单击或页面加载）进行 格排序，请调用sort方法。

<input type='button' value='Sort by task name' onclick='gantt.sort("text", true);'><script type="text/javascript" charset="utf-8">    gantt.init("gantt_here");    gantt.parse(tasks);</script>

自定义排序功能

要将自定义排序功能应用于 格，请使用您的自定义函数名称作为第一个（也是唯一一个）参数来调用sort方法。

为每对相邻值调用一个自定义排序函数，并返回1，-1或0：

• 1-具有第一个值对的对象必须位于第二个对象之前；
• -1-第二个对象在第一个对象之前；
• 0-两个对象的顺序不变。

<input type='button' value='Sort by the number of holders'       onclick='sortByHolders(direction)'><script type="text/javascript" charset="utf-8">    var direction = false;    function sortByHolders(direction1){        direction = !direction;        gantt.sort(sortHolders);    };    function sortHolders(a,b){         a = a.users.length;         b = b.users.length;         if (direction){            return a>b:(a<b1:0);         } else {            return a>b1:(a<b:0);         }    };</script>

每列 格排序

可以为每个特定的列指定自定义排序规则。每列有三种最常见的排序方案：

1）通过将sort设置为false来禁用对列的排序

gantt.config.columns[1].sort = false;

2）通过将排序功能设置为一个功能，根据提供的排序功能对列进行排序

gantt.config.columns[1].sort = function(a,b){    return custom_function(a,b);};

为一对任务对象（a和b）调用自定义排序功能，并返回1，-1或0：

• 1-具有第一个值对的对象必须位于第二个对象之前；
• -1-第二个对象在第一个对象之前；
• 0-两个对象的顺序不变。

3）根据所述任务的不同字段的值通过设定排序的列的排序到该字段

gantt.config.columns[1].sort = 'other_field';

关产品推荐：

VARCHART XGantt：支持ActiveX、.Net等平台的C#甘特图控件

AnyGantt：构建复杂且内容丰富的甘特图的理想工具

jQuery Gantt Package：基于HTML5 / jQuery的跨平台jQuery Gantt包

phGantt Time Package：对任务和时间的分配管理的甘特图

APS帮助提升企业生产效率，真正实现生产排程可视化呈现与控制,快速有效响应不同场景的生产计划，提高准时交货能力，提高产能和资源利用率

想要购买dhtmlxGantt正版授权，或了解APS系统请点击【咨询在线客服】
标签：