1 Answer, 1 is accepted
Hi Aleksandr,
When a request sent to the remote service is finished the requestend event of the datasource is fired:
- https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/events/requestend
When the data is loaded in the DropDownList the dataBound event will be fired:
- https://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist/events/databound
In the Dojo example linked here, there will be alerts notifying when the requestEnd and the dataBound events are fired for the Categories and the Products cascading DropDownLists.
Please review the example and let me know in case you have additional questions.
Regards,
Neli
Progress Telerik
i did it the same way using deferred, but it works unstable, sometimes when you show the form, the form makes more events than we expect & some of the calls never resolve (reproducible, but chaotic )
if (elem.editor === "DropDownList") {
//debugger;
if (elem.editorOptions.dataSource && elem.editorOptions.dataSource.transport) {
elem.editorOptions.dataSource.requestStart = function () {
console.log('start | ' + elem.field);
that.remoteCalls.push({ field: elem.field, call: $.Deferred() });
};
elem.editorOptions.dataBound = function() {
console.log('bound | ' + elem.field);
//debugger;
var item = that.remoteCalls.find((item) => item.field === elem.field);
if (item !== -1) {
var index = that.remoteCalls.indexOf(item);
item.call.resolve();
that.remoteCalls.splice(index, 1);
console.log('resolved | ' + elem.field);
}
}
}
}
kendo.ui.progress($("#" + this.id + "_editPopupWindow").data("kendoWindow").wrapper, true);
var call = this.FormDataGet(this.itemId, this.isCopy);
var that = this;
$.when(call).then(function () {
var calls = that.remoteCalls.map((elem) => elem.call);
$.when.apply(null, calls).then(function () {
that.BindClickEvents();
console.log('form | click | bind | complete');
kendo.ui.progress($("#" + that.id + "_editPopupWindow").data("kendoWindow").wrapper, false);
})
});
Hi Aleksandr,
From the provided information I am not sure what might be the cause of the issue experienced on your side. Could you please try to modify the Dojo example I have sent previously in order to reproduce the behavior the way it is on your side and send it back for a review? This way we could get a better idea of the possible cause of the observed issue.
Looking forward to your reply.
Regards,
Neli
i did not have time to create dojo, just returned to this task, but this is an example of double calls
kendoCustomGeneric.js:1307 start | Category kendoCustomGeneric.js:1307 start | Type kendoCustomGeneric.js:1307 start | Status kendoCustomGeneric.js:1307 start | Disposition kendoCustomGeneric.js:1333 form | ShowCreateOrEditWindow kendoCustomGeneric.js:1370 form | data | start kendoCustomGeneric.js:1312 bound | Category kendoCustomGeneric.js:1319 resolved | Category kendoCustomGeneric.js:1307 start | Category kendoCustomGeneric.js:1307 start | Type kendoCustomGeneric.js:1307 start | Status kendoCustomGeneric.js:1307 start | Disposition kendoCustomGeneric.js:1393 form | data | resolved kendoCustomGeneric.js:1307 start | Agency kendoCustomGeneric.js:1312 bound | Category kendoCustomGeneric.js:1319 resolved | Category kendoCustomGeneric.js:1312 bound | Agency kendoCustomGeneric.js:1319 resolved | Agency kendoCustomGeneric.js:1312 bound | Disposition kendoCustomGeneric.js:1319 resolved | Disposition kendoCustomGeneric.js:1312 bound | Status kendoCustomGeneric.js:1319 resolved | Status kendoCustomGeneric.js:1312 bound | Type kendoCustomGeneric.js:1319 resolved | Type
this.ShowCreateOrEdit = function (itemId, isCopy) { if (!this.editController) { this.editController = new EditController("<%= KendoGridEditForm.ClientID%>",siteRoot, "api/EntityLicense/", "License", this.editFormItems(itemId), 2, 'Please enter the following information for any gaming and non-gaming licenses held by the entity.'); } this.editController.ShowCreateOrEditWindow(itemId, function () { this.grid.dataSource.read(); }.bind(this), isCopy); };
this is what is executed once
this.BuildMainForm = function () {
var form = $("#" + this.id + "_editForm").kendoForm({
layout: "grid",
grid: {
cols: this.calls,
gutter: 20
},
buttonsTemplate: "<button id='" + this.id + "_editFormSubmit' class='k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-button-solid-primary' disabled>Save</button><button id='" + this.id + "_editFormCancel' class='k-button k-button-md k-rounded-md k-button-solid k-button-solid-base'>Cancel</button>",
items: this.items,
}).data("kendoForm");
return form;
};
the core of the problem
2 stat
1 bound
----------------
2 possible solutions
1 - init form every time we show it
2 - somehow tell the form not to request glossaries when we show popup
not sure 100% yet, but seems the solution is
elem.editorOptions.autoBind = false;
Hi Aleksandr,
As far as I udnerstand you managed to reolve the issue by yourself. Thank you for sharing the solution that resolved the problem in your scenario. In case you have follow up questions, please let us know.
Regards,
NEli