Grid doesn't display data

2 posts, 0 answers
  1. Scott
    Scott avatar
    24 posts
    Member since:
    Oct 2019

    Posted 07 Feb 2020 Link to this post

    This is driving me nuts. I have a drop-down that onChange sends a query for the grid's data. I can see in my debugger that it is hitting my method in my controller and can see that the query actually returns rows but I get nothing showing up in the grid.

    And before you ask, I did the camel-case serializer fix that is described many times over in these threads

     

     .AddJsonOptions(options => {
                        options.SerializerSettings.ContractResolver = new DefaultContractResolver();

                    });

     

    but it didn't help. I verified that the json looks correct by hitting the controller method directly and the fields are in PascalCase. I dumbed the grid down as much as possible to try to troubleshoot but no luck and I get no errors in my js console. Help! Here's my code

     

      @(Html.Kendo().Grid<Data.Model.Client>()
                    .Name("grid")
                    .Columns(columns => {
                        columns.Bound(e => e.ClientID);
                        columns.Bound(e => e.ClientName);
                        columns.Bound(e => e.ClientStatus);
        
                    })
                    .Sortable()
                    .Pageable()
                    .Scrollable()
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(10)
                        .Read(read => read.Action("GetClients", "Home")
                        .Data("filterGrid"))
                    )
                    
                )
                <script>
                    function filterGrid() {
                        return {
                            stateId: $("#ddlStates").val()
                        };
                    }
        
                   
            </script>

  2. Nikolay
    Admin
    Nikolay  avatar
    301 posts

    Posted 12 Feb 2020 Link to this post

    Hi Scott,

    I have replied to your other thread on the same topic but I will post here as well so others can benefit from it.

    The Grid declaration is correct and the issue is most likely with the returned data from the controller. The grid expects a JSON as a response to its read request, however, the data must be converted to a Kendo.Mvc.UI.DataSourceResult object first. This is done using the ToDataSourceResult extension method.

    I would recommend checking the below Ajax Binding article as a guideline on how to configure the Grid HtmlHelper extension for Ajax binding:

    Let me know if you have further questions.

    Regards,
    Nikolay
    Progress Telerik

    Get quickly onboarded and successful with Telerik UI for ASP.NET Core with the dedicated Virtual Classroom technical training, available to all active customers.
Back to Top