jQWidgets Forums
jQuery UI Widgets › Forums › Layouts › Kanban › Kanban: Source JSON
Tagged: javascript kanban, jquery kanban, json, kanban, source
This topic contains 6 replies, has 3 voices, and was last updated by lourivalos83 8 years, 10 months ago.
-
AuthorKanban: Source JSON Posts
-
Hi everybody,
The source code of the kanban example is a little to complicated for me.
I wanna know how can we populate a kanban with a json format.
For example :
{“identity”:”Steven Buchanan”,”text”:”One item added to the cart”,”color”:”#D8D8D8″}Thx for your help.
KS
Hi ksaidi,
To populate jqxKanban from json you have to use a dataAdapter.
In this dataAdapter you have to map kanban’s dataFields to the existing ones in your data source.
In this demo is demonstrated populating from an array, but the approach is the same.Here is the dataAdapter’s demo with json binding. It also can be helpful for you.
Best Regards,
Ivailo IvanovjQWidgets Team
http://www.jqwidgets.comHi Ivailo,
Thx for your reactivity.
I’m gonna try right now…KS
Yep,
Hard to make it work !!!!
Need help…
here is my code :var fields = [ { name: "lastname", type: "string" }, { name: "firstname", type: "string" }, { name: "role", map: "label", type: "string" }, { name: "customer", type: "string" }, { name: "color", type: "string" } ]; var source = { localData: [{"lastname":"AAAAAA","firstname":"BBBBB","label":"NOT SPECIFIED","customer":"CCCCC","color":"#D8D8D8"}], dataType: "json", dataFields: fields }; var dataAdapter = new $.jqx.dataAdapter(source, { loadComplete: function (records) { // get data records. var records = dataAdapter.records; // get the length of the records array. var length = records.length; // loop through the records and display them in a table. var html = ""; for (var i = 0; i < 20; i++) { var record = records[i]; html += "<tr>"; html += "<td>" + record.lastname + "</td>"; html += "<td>" + record.firstname+ "</td>"; html += "<td>" + record.role+ "</td>"; html += "<td>" + record.customer+ "</td>"; html += "<td>" + record.color+ "</td>"; html += "</tr>"; } console.log(html); }, loadError: function (jqXHR, status, error) { }, beforeLoadComplete: function (records) { } }); // perform data binding. dataAdapter.dataBind();
An error on console log : record undefined.
I don’t know what is wrong…Hi ksaidi,
Please, try this demo.
Here the kanban widget is populated from your source.Best Regards,
Ivailo IvanovjQWidgets Team
http://www.jqwidgets.comThx ivailo !!!
it works for me…Hi Everyone,
I populated the Kanban with JSON, but my problem is to update the itens with DataAdapter, I buld a sample here:
https://www.jseditor.io/?key=kanban-databindMy problem is how to update itens using
dataAdapter.dataBind();
, all my itens was just duplicated everytime I click on “Refresh data 1” link.What is the correc approach to refresh existing itens on Kanban? Nowdays I’m calling ‘destroy’, and rebuilding the Kanban from scratch.
-
AuthorPosts
You must be logged in to reply to this topic.