项目管理工具DHTMLX Gantt灯箱元素配置教程:如何验证

news/2024/11/26 4:15:55/

DHTMLX Gantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表。可满足项目管理应用程序的大部分开发需求,具备完善的甘特图图表库,功能强大,价格便宜,提供丰富而灵活的JavaScript API接口,与各种服务器端技术(PHP,ASP.NET,Java等)简单集成,满足多种定制开发需求。本文给大家讲解项目管理工具DHTMLX Gantt灯箱元素配置教程:如何验证,欢迎大家下载最新版试用体验。

DHTMLX Gantt正版试用下载(qun:764148812)icon-default.png?t=N176https://www.evget.com/product/4213/download

验证允许您控制用户输入的数据,以排除保存不正确值的可能性。例如,通过验证,您可以拒绝将 2 个同时执行的任务分配给一个人。

通常,要验证用户输入的数据,使用dhtmlxGantt API提供的事件并捕获输入数据以根据其正确性进行处理:

1、客户端验证

以下事件最重要且常用于数据验证:

  • onLightboxSave - 当用户点击灯箱中的“保存”按钮时触发
  • onBeforeTaskAdd - 在新任务添加到甘特图之前触发
  • onBeforeTaskChanged - 在更新任务之前触发
  • onBeforeLinkAdd - 在将新链接添加到甘特图之前触发
  • onBeforeLinkUpdate - 在更新链接之前触发

最简单的验证可以在onLightboxSave事件的帮助下实现。当用户单击表单上的“保存”按钮时,将调用该事件。从事件中返回true将保存更改,返回false将取消进一步处理并使灯箱保持打开状态。

例如,要限制任务的保存,如果没有分配给它的用户,请使用如下代码:

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

相关示例: 验证灯箱值

2、服务器端验证

上面的解决方案有一个缺点 - 如果灯箱中的数据已通过内联编辑器或通过拖动甘特图进行更改,则事件不会触发。

为了证明这一点并捕获甘特图中所做的所有更改(编辑、创建、删除等),请使用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) {
dhtmlx.message("The event's text can't be empty!");
return false;
}
return true;
});

where:

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

请注意,当字段验证失败时,更改不会发送到服务器,而是保留在客户端并可用于进一步处理。


http://www.ppmy.cn/news/31413.html

相关文章

(蓝桥真题)剪格子(搜索+剪枝)

样例1输入: 3 3 10 1 52 20 30 1 1 2 3 样例1输出: 3 样例2输入: 4 3 1 1 1 1 1 30 80 2 1 1 1 100 样例2输出: 10 分析:这道题目我们直接从(1,1)点开始进行dfs搜索即可,但是需要注意一点的是我们搜…

【正则表达式】正则表达式语法规则

正则表达式语法规则1.普通字符 字符描述[ABC]匹配 […] 中的所有字符[^ABC]匹配除了 […] 中字符的所有字符[A-Z][A-Z] 表示一个区间,匹配所有大写字母,[a-z] 表示所有小写字母.匹配除换行符以外的任意字符[\s\S]匹配所有。\s 是匹配所有空白符&#xf…

机器看世界

博主简介 博主是一名大二学生,主攻人工智能研究。感谢让我们在CSDN相遇,博主致力于在这里分享关于人工智能,c,Python,爬虫等方面知识的分享。 如果有需要的小伙伴可以关注博主,博主会继续更新的&#xff0c…

Git设置SSH Key

一、git 配置 (1)打开 git 命令窗口 (2)配置用户名(填自己的姓名) git config --global user.name “xinyu.xia” (3)配置用户邮箱(填自己的邮箱&#xff0…

品牌营销 | 学习如何最大限度地发挥品牌营销的作用

您是否想过如何最大限度地发挥品牌营销的潜力?这是一项艰巨的挑战,通过了解品牌营销的基本组成部分,您可以成功地推广您的品牌。 (图源:Pixabay) 品牌营销的基本组成部分 你需要做什么来发展稳固的品牌&am…

MySQL DDL表操作【入门到精通】

目录 一、查询创建 1、查询当前数据库所有表 2、查看指定表结构 3、查询指定表的建表语句 4、创建表结构 二、数据类型 1、数值类型 2、字符串类型 3、日期时间类型 三、表操作-案例 设计一张员工信息表,要求如下: 对应的建表语句如下&#…

一文教会你如何简单使用Fegin进行远程服务调用

文章目录1、fegin的基本介绍2、fegin的基本使用步骤3、项目中的实际运用4、测试前言在分布式微服务中,少不了会进行不同服务之间的相互调用,比如A服务要调用B服务中的接口,如何简单方便的实现呢?fegin可以来帮助。 1、fegin的基本…

vue+echarts.js 实现中国地图——根据数值表示省份的深浅——技能提升

最近在写后台管理系统&#xff0c;遇到一个需求就是 中国地图根据数值 展示深浅颜色。 效果图如下&#xff1a; 直接上代码&#xff1a; 1.html部分 <div id"Map"></div>2.css部分——一定要设置尺寸 #Map {width: 100%;height: 400px; }3.js部分 …