dhtmlx-gantt灯箱保存事件
时间: 2023-09-30 15:04:07 浏览: 208
dhtmlx-Gantt是一个用于创建甘特图的JavaScript库。灯箱保存事件是指当用户在灯箱中编辑或创建任务时,点击保存按钮后触发的事件。在dhtmlx-Gantt中,可以通过监听'onLightboxSave'事件来执行保存操作。具体的代码示例如下:
```
gantt.attachEvent("onLightboxSave", function(id, task){
// 在这里执行保存操作,比如将任务数据发送到后端进行保存
// id表示任务的id,task表示任务的相关信息
// 保存成功后,可以根据需要进行一些操作,比如刷新甘特图等
});
```
请注意,上述代码中的gantt对象是dhtmlx-Gantt的实例对象,你需要根据你的实际代码进行相应的调整。
相关问题
dhtmlx-gantt灯箱
### DHTMLX Gantt 灯箱配置使用教程
#### 创建基本灯箱结构
为了创建并自定义DHTMLX Gantt的灯箱,开发者可以利用`gantt.config.lightbox.sections`属性来指定灯箱内部的不同部分。这允许对默认布局进行调整或是完全替换为新的组件组合。
```javascript
gantt.config.lightbox.sections = [
{name: "description", height: 70, map_to: "text", type: "textarea", focus: true},
{name: "time", type: "duration", map_to: "auto"}
];
```
此段代码设置了两个主要区域:一个是描述区,另一个是时间持续区间[^1]。
#### 自定义灯箱字段映射
通过设置`map_to`参数,能够决定哪个数据字段应该被绑定到特定的部分上。例如,在上述例子中的`description`区块将会展示由`text`键所代表的任务说明文字;而`time`则自动处理开始时间和结束时间之间的差异计算。
#### 添加额外输入控件
如果希望向灯箱内加入更多类型的交互元素,则可以通过扩展sections数组实现这一目标。比如增加一个用于选择负责人的下拉列表:
```javascript
{name:"users",type:"select",options:[{key:"",label:"- Select user -"},...],map_to:"assigned_user_id"},
```
这里的关键在于理解如何构建选项对象以及它们是如何关联至实际的数据模型上的[^2]。
#### 控制灯箱行为逻辑
除了界面外观外,还可以进一步控制当用户操作这些新增加部件时的行为方式。例如监听某个事件发生后的动作响应函数:
```javascript
gantt.attachEvent("onLightboxButtonAdd", function(id){
var task = gantt.getTask(id);
console.log(task); // 打印当前编辑的任务信息
});
```
这段脚本会在每次点击“添加新任务”的按钮之后触发,并获取即将保存的新条目详情以便做后续处理。
dhtmlx gantt 灯箱顶部表头gantt_title不展示
关于dhtmlx gantt的问题,如果gantt_title不展示,可能是由于以下几个原因导致的:
1. CSS样式问题:请确保您的样式文件正确引入,并且没有其他样式覆盖了gantt_title的显示。您可以通过检查浏览器开发者工具来确认是否存在样式冲突或覆盖。
2. 配置问题:请确保您正确配置了gantt_title的相关属性,如title属性或columns配置项。您可以在初始化gantt对象时使用这些选项来定义表头的显示。
3. 数据问题:如果没有为gantt_title提供任何数据,它可能不会显示。请确保您为gantt对象提供了正确的数据源,并且相关的列已经在数据中定义。
如果以上解决方案都没有解决您的问题,请提供更多相关的信息,以便我可以更好地帮助您解决这个问题。
阅读全文
相关推荐











