ddx参数设置（ddx设置成功率100）

这篇文章给大家讲解如何利用dhtmlxGantt在服务器端集成数据。

客户端

1)调用load方法，其中作为参数指定以JSON格式返回甘特图数据的URL。

2)使用以下两种方式之一创建DataProcessor实例：

初始化DataProcessor并将其附加到dhtmlxGantt对象：

gantt.init("gantt_here"); gantt.load("apiUrl"); // keep the order of the lines below var dp = new gantt.dataProcessor("apiUrl"); dp.init(gantt); dp.setTransactionMode("REST");

调用createDataProcessor方法并传递一个带有配置选项的对象作为其参数：

var dp = gantt.createDataProcessor({ url: "apiUrl", mode: "REST" });

创建数据处理器

1.使用预定义的请求模式之一，如：

var dp = gantt.createDataProcessor({ url: "/api", mode: "REST" });

位置：

url-服务器端的URL
mode-向服务器发送数据的模式：“JSON”|“REST-JSON”|“JSON”|“邮政”|“得到”

2.提供自定义路由器对象：

var dp = gantt.createDataProcessor(router);

其中路由器是一个功能：

// entity - "task"|"link" // action - "create"|"update"|"delete" // data - an object with task or link data // id – the id of a processed object (task or link) var dp = gantt.createDataProcessor(function(entity, action, data, id) { switch(action) { case "create": return gantt.ajax.post( server "/" entity, data ); break; case "update": return gantt.ajax.put( server "/" entity "/" id, data ); break; case "delete": return gantt.ajax.del( server "/" entity "/" id ); break; } });

或是以下结构的对象：

var dp = gantt.createDataProcessor({ task: { create: function(data) {}, update: function(data, id) {}, delete: function(id) {} }, link: { create: function(data) {}, update: function(data, id) {}, delete: function(id) {} } });

对象的所有函数都路由器应该返回一个Promise或一个数据响应对象。这是 dataProcessor应用数据库id并挂钩onAfterUpdate事件所必需的。

outer = function(entity, action, data, id) { return new gantt.Promise(function(resolve, reject) { // … some logic return resolve({tid: databaseId}); }); }

因此，您可以使用DataProcessor将数据保存在localStorage或任何其他未链接到某个URL的存储中，或者如果有两个不同的服务器(URL)负责创建和删除对象。

请求和响应详细信息

URL由以下规则构成：

api/链接/id
api/任务/id

其中“api”是您在dataProcessor配置中指定的URL。

可能的请求和响应的列表是：

ACTION	HTTP	URL	RESPONSE
加载数据	GET	/apiUrl	JSON格式
添加新任务	POST	/apiUrl/任务	{"action":"inserted","tid":"taskId"}
更新任务	PUT	/apiUrl/task/taskId	{“行动”：“更新”}
删除任务	DELETE	/apiUrl/task/taskId	{“行动”：“删除”}
添加新链接	POST	/apiUrl/链接	{"action":"inserted","tid":"linkId"}
更新链接	PUT	/apiUrl/link/linkId	{“行动”：“更新”}
删除链接	DELETE	/apiUrl/link/linkId	{“行动”：“删除”}

请求参数

创建/更新/删除请求将包含客户端任务或链接对象的所有公共属性：

任务：

开始日期：2017-04-08 00:00:00
持续时间：4
文本：任务#2.2
父级：3
结束日期：2017-04-12 00:00:00

关联：

来源：1
目标：2
类型：0

笔记：

格式start_date和end_date参数由date_format配置定义。
客户端发送任务或链接对象的所有公共属性。因此，请求可以包含任意数量的附加参数。
如果您通过向其添加新列/属性来扩展数据模型，则不需要额外的操作来使甘特图将它们发送到后端。

REST-JSON 模式

除了“POST”、“GET”、“REST”和“JSON”事务模式，甘特数据处理器也可以用于“REST-JSON”模式。

gantt.load("apiUrl"); var dp = gantt.createDataProcessor({ url: "/apiUrl", mode: "REST-JSON" });

在REST模式中，数据以以下形式发送到服务器：

Content-Type: application/x-www-form-urlencoded

而在REST-JSON模式下，数据以JSON格式发送：

Content-type: application/json

因此参数作为JSON对象发送，请求有效载荷

任务

{ "start_date": "20-09-2018 00:00", "text": "New task", "duration":1, "end_date": "21-09-2018 00:00", "parent": 0, "usage":[{ {"id":"1", "value":"30"}, {"id":"2", "value":"20"} }] }