Hi,
After data is loaded initially the onAfterLoad fires fine on the board, I’m using this to set some values manually on my card.
After an action on the board though eg. collapsing a column, clicking a tab etc. then all cards seem to get re-initialized from the type definition - which is ok but which event fires after this because onAfterLoad plays no role here?
Ideally I’d like to subscribe to an event on the webix.type(webix.ui.kanbanlist object that fires after each item is bound/instantiated.
to set some values manually on my card
Did you tried to do it via updateItem or some other method? Can you please describe your use-case a bit further or provide a snippet of your implementation?
As for data visualization, templates are handling any changes in items’ reprsentation (according to the type): selection, resize, etc. The sequence of events are the following (for each list): onBeforeRender
,onItemRender
for each item in the list,onAfterRender
.
It’s hard to post usage as my code has got quite complicated, but basically:
My type’s templateBody returns
html += "<div class='sliderRepair' id='slRepair"+obj.id+"' ></div>";
the slider gets created by javascript so later when loading is finished I loop through all data, find slRepairX and then slRepairX.slider({value:20}) creates a nice jquery slider control in the div with a value of 20.
This the value that gets lost during board actions because the cards get updated but onAfterLoad (understandably) doesn’t fire again.
‘onItemRender’ looks promising - how do I use that?
Sorry, the post stripped out my code:
My type’s templateBody returns a div with id=slRepairX where X is obj.id so I have a uniquely named div in each card.
It is ok, I see now that onItemRender and onAfterRender both bind to a kanbanList and not kanban and I have it working.
How to I iterate through all items in the list in onAfterRender?
fyi I found a good solution, I handle the onAfterRender of each list and then iterate through the data for that list using:
$$("listid").attachEvent("onAfterRender", function(){
$$("$listid").data.each(function(itemData) {
//Do something with itemData;
});
});