TreeView not boundable to DataSourceRequest

[Jan]

Hello,

I'm using remote data binding. If I return Json(listNodes) everything works as expected, but if it is Json(listNodes.ToDataSourceResult(request, ModelState)), a "e.slice is not defined" javascript error is thrown.

 

It would be nice to have a DataSourceResult, so I can add errors to the modelstate and handle them in the .Error() method on the client. Or is there any other way to return an error to the TreeView if data fetching fails serverside?

[Bozhidar]

Hello,

These methods are part of Kendo UI for ASP.Net MVC, and cannot be used out of the box with KendoUI for jQuery. You can refer to the following thread for further information:
https://www.telerik.com/forums/how-do-i-use-the-datasourcerequest-object-as-an-asp-net-mvc-action-parameter

Regards,
Bozhidar
Progress Telerik

[Jan]

I am actually using Kendo UI for ASP.NET MVC. So I just want to bind the DataSourceResult-Method to a Treeview-Server Side Wrapper.

[Bozhidar]

Hello,

Thank you for the clarification. 

Unfortunately as the TreeView widget doesn't support DataSourceResult responses, as it's not a widget that employs Paging, sorting etc.

You can take the approach from the following discussion, and return an Json with the ModelState errors:
https://stackoverflow.com/questions/28317620/how-to-handle-client-side-error-handling-in-kendo-grid/28323462#28323462

Here's an adapted example:

public JsonResult Employees(int? id)
{
    var errMsg = ModelState.Values
        .Where(x => x.Errors.Count >= 1)
        .Aggregate("Model State Errors: ", (current, err) => current + err.Errors.Select(x => x.ErrorMessage));

    ModelState.AddModelError(string.Empty, errMsg);

    return JsonError(ModelState);
}

protected JsonResult JsonError(ModelStateDictionary modelState)
{
    if (modelState == null) new ArgumentNullException();
    if (modelState.IsValid) new ArgumentException();

    Response.Clear();
    Response.ContentEncoding = Encoding.UTF8;
    Response.HeaderEncoding = Encoding.UTF8;
    Response.TrySkipIisCustomErrors = true;
    Response.StatusCode = 400;

    return Json(String.Join("\n", modelState.SelectMany(state => state.Value.Errors, (state, error) => error.ErrorMessage)));
}

<div class="demo-section k-content">
    @(Html.Kendo().TreeView()
        .Name("treeview")
        .DataTextField("Name")
        .DataSource(dataSource => dataSource
            .Events(e => e.Error("error_handler"))
            .Read(read => read
                .Action("Employees", "TreeView")
            )
        )
    )
</div>


<script>

    function error_handler(e) {
        console.log(e.xhr.responseText);
    }

</script>

Hope this was helpful.

Regards,
Bozhidar
Progress Telerik

[Jan]

This was very helpful, thanks a lot!