KENDO UI 'Uncaught TypeError: e.slice is not a function'

Question

I have a very weird thing going on. When the below 2 scripts are added on my view. I got the error

'Uncaught TypeError: e.slice is not a function'

on success block of ajax call.

Html.AppendScriptParts(string.Format("~/Administration/Scripts/kendo/{0}/kendo.data.min.js", kendoVersion));
Html.AppendScriptParts(string.Format("~/Administration/Scripts/kendo/{0}/kendo.web.min.js", kendoVersion));

this is my response from backend.

{"ExtraData":null,"Data":[{"Id":3,"TotalLicense":0,"TotalAvailableLicense":0,"TotalSoldLicense":0,"TotalLicenseAssignedToCustomer":0,"ProductSKU":"SLN-PP-001","ProductName":"Prepaid code - Full Stream License BCM 30 days","LicenseNumber":"BCQH EKDJ LP8E","Runtime":null,"ActivationStart":"01/01/0001","ActivationEnd":"01/01/0001","OwnerName":"Suman Kumar","OwnerEmail":"[email protected]","ShortDescription":null,"OrderNumber":7,"ProductSeName":"prepaid-code-full-stream-license-bcm-30-days","SearchProductSKU":null,"SearchProductName":null,"SearchLicenseNumber":null,"SearchOwnerName":null,"SearchOwnerEmail":null,"SearchOrderNumber":0,"ShowProductSKUFront":false,"ShowProductNameFront":false,"ShowLicenseNumberFront":false,"ShowRuntimeFront":false,"ShowActivationStartFront":false,"ShowActivationEndFront":false,"ShowOwnerNameFront":false,"ShowOwnerEmailFront":false,"ShowShortDescriptionFront":false,"ShowOrderNumberFront":false,"ShowProductSKUBack":false,"ShowProductNameBack":false,"ShowLicenseNumberBack":false,"ShowRuntimeBack":false,"ShowActivationStartBack":false,"ShowActivationEndBack":false,"ShowOwnerNameBack":false,"ShowOwnerEmailBack":false,"ShowShortDescriptionBack":false,"ShowOrderNumberBack":false,"CustomProperties":{}},{"Id":4,"TotalLicense":0,"TotalAvailableLicense":0,"TotalSoldLicense":0,"TotalLicenseAssignedToCustomer":0,"ProductSKU":"SLN-PP-001","ProductName":"Prepaid code - Full Stream License BCM 30 days","LicenseNumber":"DW4W BBAJ TFQX","Runtime":null,"ActivationStart":"01/01/0001","ActivationEnd":"01/01/0001","OwnerName":"Suman Kumar","OwnerEmail":"[email protected]","ShortDescription":null,"OrderNumber":8,"ProductSeName":"prepaid-code-full-stream-license-bcm-30-days","SearchProductSKU":null,"SearchProductName":null,"SearchLicenseNumber":null,"SearchOwnerName":null,"SearchOwnerEmail":null,"SearchOrderNumber":0,"ShowProductSKUFront":false,"ShowProductNameFront":false,"ShowLicenseNumberFront":false,"ShowRuntimeFront":false,"ShowActivationStartFront":false,"ShowActivationEndFront":false,"ShowOwnerNameFront":false,"ShowOwnerEmailFront":false,"ShowShortDescriptionFront":false,"ShowOrderNumberFront":false,"ShowProductSKUBack":false,"ShowProductNameBack":false,"ShowLicenseNumberBack":false,"ShowRuntimeBack":false,"ShowActivationStartBack":false,"ShowActivationEndBack":false,"ShowOwnerNameBack":false,"ShowOwnerEmailBack":false,"ShowShortDescriptionBack":false,"ShowOrderNumberBack":false,"CustomProperties":{}}],"Errors":null,"Total":2}

And when i remove the below JS,

//Html.AppendScriptParts(string.Format("~/Administration/Scripts/kendo/{0}/kendo.data.min.js", kendoVersion));

the error varnished. But both these JS has to be added in the view for some other functionality.

kendo.web.min.js:13 Uncaught TypeError: e.slice is not a function
at init.success (kendo.web.min.js:13)
at i (jquery-1.10.2.min.js:4)
at Object.n.success (kendo.data.min.js:11)
at c (jquery-1.10.2.min.js:4)
at Object.fireWith [as resolveWith] (jquery-1.10.2.min.js:4)
at k (jquery-1.10.2.min.js:6)
at XMLHttpRequest.r (jquery-1.10.2.min.js:6)

Can anyone please elaborate what is going wrong here, am I missing anything?

Answer 1

I too was getting this error when I used kendo.DataSource without a widget to retrieve a single object (serialized as JSON) from the backend. My fix was to add a fake slice() function that returns a clone of the object itself:

            schema: {
                data: (response: any) => {
                    // Augment returned data with a slice() method used internally by Kendo DataSource 
                    // in the absence of "schema.model" to obtain a pristine copy of the object.
                    response.slice = () => JSON.parse(JSON.stringify(response));
                    return response;
                }
            }

Answer 2

I was getting this error with a kendoAutoComplete editor control when clearing the control. It didn't happen when first typing characters into the control because it didn't make a server request until there were at least two characters entered. The control used server filtering to retrieve data via a JSON request. The issue was that I was testing for a null or empty filter on the server and in that situation returned an empty JSON object.

The fix was to return an empty JSON array.