kendo UI TreeList getting API 200/500 response code

1 Answer 124 Views
Drag and Drop TreeList
Kok Ho
Top achievements
Rank 1
Kok Ho asked on 20 Feb 2023, 09:55 AM | edited on 22 Feb 2023, 09:59 AM

Hi,

There are question as below, I could not provide a code snippet because for editing require an API which are not available as development is in progress

  • can I know is there a way to get the response code / response message after the API is call. For example code below, after the create API call I would like to get the response code example 200 or 500 so that we can manipulate error message that require to show for user. Example if kendo taskboard it have "requestEnd" event
transport: {
	read: {
		url: crudServiceBaseUrl ,
		dataType: "json"
	},
	create: {
		url: crudServiceBaseUrl + "/add",
		dataType: "json"
	},
	update: {
		url: crudServiceBaseUrl + "/update",
		dataType: "json"
	},
	destroy: {
		url: crudServiceBaseUrl + "/delete",
		dataType: "json"
	},
	parameterMap: function (options, operation) {
		if (operation !== "read" && options.models) {
			return { models: kendo.stringify(options.models) };
		}
	}
},
  • when I perform  transport "destroy", I realize that it will first remove the node before calling API. I wonder what happen if I fail to remove from our own logic (hit issues when remove from database) then how can we revert the node? 
  • Is it in treelist we can get parent value and assign to a hidden field? Treelist only support number for id and parentid (hierarchy), howeer in our case we use GUID. Therefore, I generate number just for hierarchy display (and drag and drop) purpose. However the models only recognize the parentid but not guid that is from other field.
  • on my page I reliaze that sometimes the jquery are calling the API and sometimes not? Is it related to the placement file of my kendo script versus jquery file?
  • When I add new item, from backend we success to trigger and I return response 200 and model data as per below
{"Project":"e81af126-13cd-40c4-951b-9611fa85f39c","ID":"fc980fda-40c5-4fda-b97d-dfc0aced6a10","Description":"123123","WBSType":1,"SequenceNumber":0,"Parent":null,"BudgetSalesAmountDC":0.0,"BudgetCostsAmountDC":0.0,"Quantity":10.0,"WBSIcon":"","ReportsTo":null,"WBSRunningNumber":0,"hasChildren":false}

however from front-end it will never append. I follow exact implementation from the snippet / tutorial, accept the response type 

1 Answer, 1 is accepted

Sort by
0
Neli
Telerik team
answered on 23 Feb 2023, 08:49 AM

Hi,

  • You can configure the schema.errors as a function or handle the error event of the datasource and check the error returned from the server.

- https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/schema#schemaerrors

https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/events/error

  • When an error event is fired, the DataSource does not process any data items which may also be part of the server response. You can read more about the error handling with the remote CRUD operations in the link from our documentation below:

https://docs.telerik.com/kendo-ui/framework/datasource/crud#remote-transport-error-handling

  • As discussed in the other forum thread regarding having guid in TreeList - the TreeList model expects a number for the parentId field and if such is not provided the widget will not be able to correctly set the parent id when drag and drop is performed.
  • on my page I realize that sometimes jquery are calling the API and sometimes not. Is it related to the placement file of my kendo script versus the jquery file? - Could you please provide more details about the issue and the implementation on your side?  Is it a specific method that is not invoked?
  • I would suggest you try to use the dataSource read method after the new item has been added:

- https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/methods/read

I hope this helps. 

Regards,
Neli
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Kok Ho
Top achievements
Rank 1
commented on 23 Feb 2023, 09:01 AM | edited

API not calling:
this happen to all the method which is create, update, destroy. it will sometimes calling the end point (in MVC that act as API) and sometimes not. However for read, it has no issues on reading the data to render the tree. not able to provide any implementation as the end point is in local. but the implementation part is following exactly from the telerik sample

DataSource:
Does dataSource schema functionality (that contain event to check error) usable to $("#treelist").kendoTreeList({});? We are implementing TreeList https://demos.telerik.com/kendo-ui/treelist/editing and if I change the source from "TreeListDataSource " to "DataSource" it will not be working accordingly. Could provide a sample if it can be use?

Nikolay
Telerik team
commented on 28 Feb 2023, 07:52 AM

Hi Kok Ho,

My name is Nikolay and I will get hold of this thread until my colleague Neli returns to the office.

API not calling:

This calling the endpoint inconsistently is weird and we need to find a pattern when this happens and when it does not. 

I recommend checking the transport.parameterMap function. It converts the request parameters to a format suitable for the remote service. Make sure what the TreeList sends to the endpoint is what the endpoint expects.

To be able to investigate further I suggest recording and sharing a Fiddler Jam log in a private support thread. The Fiddler Jam is one of the best ways to see the issue in action and includes Scripts and Styles, Console logs/errors, Network Requests, Local/Session Storage logs, and a Screencast. This will allow me to investigate and advise further.

I suggest

DataSource:

The TreeListDataSource inherits from the kendo.data.DataSource. with some additional properties like expanded for example. So changing from TreeListDataSource to DataSource might work for most cases but not for all scenarios.

Regards,

Nikolay

 

Kok Ho
Top achievements
Rank 1
commented on 01 Mar 2023, 08:44 AM

Hi,

DataSource:

I have done some changes using Kendo Dojo (without any other code that has possibilities impact the result) https://dojo.telerik.com/edamUYAV just to do some testing by changing TreeListDataSource to DataSource. In the dojo all css and js file and also content was based on Telerik. However from what I saw it seem not working as expected. At least minimal data was not been able to load. Perhaps you can share more information or some example using the Dojo to point out what I have miss maybe

Nikolay
Telerik team
commented on 03 Mar 2023, 03:06 PM

Hi Kok Ho,

Thank you for sharing the Dojo.

Is there a specific reason you are using a DataSource instance and not a TreeListDataSource one? 

Since the TreeList represents a hierarchical structure it uses a DataSource - TreeListDataSource - designed especially for it that has properties and events such as parentId, hasChildren, and loaded.

Regards,

Nikolay

Kok Ho
Top achievements
Rank 1
commented on 05 Mar 2023, 06:48 AM

Hi,

The actual I'm using was actually TreeListDataSource, which I was not able to handle callback / API error especially if there is error within the call. Based on the chat here, it suggest to use DataSource, however I try and it did not work. Therefore, I request if there are anything in implementation that I have miss out. Maybe can correct me in the dojo? 

Nikolay
Telerik team
commented on 08 Mar 2023, 05:20 PM

Hi Kok Ho,

The Dojo seems to be working fine when the TreeListDataSource is used and such must be used for the TreeList.

It will be best if you can submit a private support thread sharing a Fiddler Jam log. It will capture all the Scripts and Styles, Console logs/errors, Network Requests, Local/Session Storage logs, and a Screencast and allow us to dig deeper and see what might be causing this undesired behavior on your side.

Regards,

Nikolay

Tags
Drag and Drop TreeList
Asked by
Kok Ho
Top achievements
Rank 1
Answers by
Neli
Telerik team
Share this question
or