Hi chae hyeoung guk,
Greetings from Syncfusion support.
We have already
logged the requested requirement as a feature on our end. This support will be
included in any one of our upcoming releases. Please track the status of the
reported issue from the below feedback.
Feedback Link : https://www.syncfusion.com/feedback/33303/need-to-provide-complex-data-binding-support-on-kanban-board
In the meantime, you should be able to fulfil your requirement
by using a dataBinding event.
In the below sample, we have bound the complex keyField data
into a Kanban board. Please find the
attached sample and code for your reference.
App.vue
|
<ejs-kanban id="kanban" keyField="StatusName" :dataSource="kanbanData"
:cardSettings="cardSettings" :dataBinding="OnDataBinding" :swimlaneSettings="swimlaneSettings">
</ejs-kanban>
<script>
export default {
data: function() {
return {
swimlaneSettings: {
keyField: "Assignee"
},
};
}
methods:{
OnDataBinding:function(args){
debugger
var kanbanData = [];
var cardData = args.result;
for (var b = 0; b < cardData.length; b++) {
var data = cardData[b];
var cardObj = {
Id: data.Id,
Title: data.Title,
StatusName: data.Status.Status1,
Assignee: data.Assignee.Assignee1,
Summary: data.Summary,
};
kanbanData.push(extend({}, cardObj, null, true));
}
args.result = kanbanData;
}
},
}
</script>
|
dataSource.js
|
exports.kanbanData = [
{
'Id': 1,
'Title': 'Task - 29001',
'Status': {Status1:"Open",Status2:"Close"},
'Summary': 'Analyze the new requirements gathered from the customer.',
'Type': 'Story',
'Priority': 'Low',
'Tags': 'Analyze,Customer',
'Estimate': 3.5,
'Assignee': {Assignee1 : 'Nancy Davloio'},
'RankId': 1
},
];
|
API Link : https://ej2.syncfusion.com/vue/documentation/api/kanban/#databinding
Please let us
know if you have any concerns.
Regards,
Vinothkumar
Attachment:
quickstart_3c614685.zip
