TreeView not boundable to DataSourceRequest

5 posts, 1 answers
  1. Jan
    Jan avatar
    31 posts
    Member since:
    Mar 2014

    Posted 08 Dec 2017 Link to this post

    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?

  2. Bozhidar
    Admin
    Bozhidar avatar
    1172 posts

    Posted 12 Dec 2017 Link to this post

    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
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Jan
    Jan avatar
    31 posts
    Member since:
    Mar 2014

    Posted 13 Dec 2017 in reply to Bozhidar Link to this post

    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.
  4. Answer
    Bozhidar
    Admin
    Bozhidar avatar
    1172 posts

    Posted 13 Dec 2017 Link to this post

    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
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Jan
    Jan avatar
    31 posts
    Member since:
    Mar 2014

    Posted 13 Dec 2017 in reply to Bozhidar Link to this post

    This was very helpful, thanks a lot!
Back to Top