验证

验证有助于确保用户输入的数据准确无误，并防止保存不正确的值。例如，它可以防止在同一时间将两个任务分配给同一个人。

通常，可以通过使用 dhtmlxGantt API 的事件来拦截并检查输入数据的正确性来进行数据验证：

客户端验证

以下事件是进行数据验证时的关键且常用事件：

• onLightboxSave - 当用户点击弹窗中的“保存”按钮时触发
• onBeforeTaskAdd - 在甘特图中添加新任务之前触发
• onBeforeTaskChanged - 在任务被更新之前触发
• onBeforeLinkAdd - 在甘特图中添加新依赖关系之前触发
• onBeforeLinkUpdate - 在依赖关系被更新之前触发

实现验证最简单的方法是使用 onLightboxSave 事件。当用户在表单中点击“保存”时，该事件会被触发。返回 true 允许保存更改，而返回 false 则会取消保存并保持弹窗处于打开状态。

例如，为了防止在没有分配用户的情况下保存任务，可以使用如下代码：

gantt.attachEvent("onLightboxSave", function(id, item){
    if(!item.text){
        gantt.message({type:"error", text:"Enter task description!"});
        return false;
    }
    if(!item.user){
        gantt.message({type:"error", text:"Choose a worker for this task!"});
        return false;
    }
        return true;
});

Related sample:  Validate lightbox values

服务端验证

上述方法的一个局限性是：如果通过内联编辑或拖拽任务进行更改，则不会触发该事件。

为了覆盖所有更改场景——包括编辑、创建和删除——可以使用 dataProcessor 对象，特别是其 onBeforeUpdate 事件。该事件会在数据发送到服务器之前、并且甘特图发生任何修改后触发，无论修改是如何产生的。

gantt.init("gantt_here");
gantt.load("data.php");
 
var dp = new gantt.dataProcessor("data.php");
dp.init(gantt);
 
dp.attachEvent("onBeforeUpdate", function (id, status, data) {
     if (!data.text) {
         gantt.message("The event's text can't be empty!");
         return false;
     }
     return true;
});

参数说明如下：

• id - (string) 任务的标识符。
• status - ('updated', 'inserted', 'deleted') 任务的操作状态。
• data - (object) 将要发送的数据。

请注意，如果某个字段未通过验证，更改将不会发送到服务器，而是保留在客户端，可以进一步处理。

Back to top