Hello friends,
I am having an issue, how can I get task data by clicking on that task. Here is my code, thanks for your help.
Hello friends,
I am having an issue, how can I get task data by clicking on that task. Here is my code, thanks for your help.
This is what you're looking for:
features: {
taskDrag: {
validatorFn(records) {
const isValid = records[0].color === '#303331';
// ... etc.
The correct function signature is to be found in docs: https://bryntum.com/docs/gantt/#Gantt/feature/TaskDrag#config-validatorFn
Hi ducminh1511,
taskClick
event has a param taskRecord
https://bryntum.com/docs/gantt/#Gantt/view/Gantt#event-taskClick
All the best,
Alex
Hi Alex,
Do you have any specific examples, I don't know how to use it. Here is my source code, can you help me fix it to work. Thank you.
I find the library really difficult
You need to go a bit slower, read more in our documentation and guides and study the sources of our many examples. Then you will learn it quickly.
Add this
listeners: {
taskclick: ({
taskRecord
}) => console.log(taskRecord))
}
to your config block:
export default {
// dependencyIdField: "sequenceNumber",
listeners: {
taskclick: ({
taskRecord
}) => console.log(taskRecord))
},
columns: [{
type: 'name',
field: 'name',
text: '名前',
width: 1
}],
subGridConfigs: {
locked: {
collapsed: true
},
},
features: {
taskDrag: {
validatorFn(taskRecords, date, duration, newResource) {
const firstDraggedTask = taskRecords[0], // or better use a loop
isValid = firstDraggedTask.color === '#303331';
return {
valid: newResource.available && isValid,
};
},
},
taskResize: {
validatorFn(record) {
console.log('taskRecord1111111', record);
return record.taskRecord.originalData.color != '#303331';
},
},
taskClick: {},
taskEdit: false,
// taskEdit: {
// items: {
// generalTab: {
// // change title of General tab
// title: "Common",
// items: {
// customDivider: {
// html: "",
// dataset: {
// text: "Custom fields",
// },
// cls: "b-divider",
// flex: "1 0 100%",
// },
// colorField: {
// type: "colorfield",
// name: "color",
// ref: "colorField",
// label: "Color",
// flex: "1 0 50%",
// cls: "b-inline",
// },
// },
// },
// notesTab : false,
// predecessorsTab : false,
// successorsTab : false,
// resourcesTab : false,
// advancedTab : false
// },
// },
timeRanges: {
// showCurrentTimeLine: {
// name: "今日",
// },
showCurrentTimeLine: true,
},
viewPreset: {
// base: "weekAndDay",
base: 'weekAndDay',
tickWidth: 52,
headers: [
// {
// unit: 'month',
// dateFormat: 'YYYY年 MMM',
// },
{
unit: 'week',
dateFormat: 'YYYY年 MMM',
},
{
unit: 'day',
dateFormat: 'ddd',
},
{
unit: 'day',
dateFormat: 'D',
},
],
},
eventColor: null,
dependencies: false,
},
taskRenderer: ({
taskRecord,
renderData
}) => {
if (taskRecord.color) {
renderData.style += `background-color:${taskRecord.color}`;
}
if (taskRecord.isLeaf && !taskRecord.isMilestone) {
return taskRecord.name;
}
},
project
};