Grid does not display data in the row

[Eric]

What's wrong with this picture. The grid in the attached image has a row with nothing in it. 

The bind method in the ajax call seems to work but no data is shown even though there is a row in the grid that shows a cursor when I hover over it.

// Razor
 @(Html.Kendo().Grid<MemberAssessmentSearchResult>()
            .Name("Assessments")
            .Columns(columns =>
                {
                    columns.Bound(item => item.DisplayName).HeaderTemplate("Member Name").Width(80);
                    columns.Bound(item => item.ProviderName).HeaderTemplate("Provider Name").Width(80);
                    columns.Bound(item => item.CampaignName).HeaderTemplate("Campaign").Width(65);
                    columns.Bound(item => item.ClientName).HeaderTemplate("Client").Width(50);
                    columns.Bound(item => item.ServiceDate).HeaderTemplate("Date of Service").Format("{0:M/d/yyyy}").Width(90);
                    columns.Bound(item => item.Source).HeaderTemplate("Source").Width(50);
                    columns.Bound(item => item.Source).HeaderTemplate("Edit").Width(50);
                    columns.Bound(item => item.ClientID).Hidden(true);
                    columns.Bound(item => item.CampaignID).Hidden(true);
                    columns.Bound(item => item.MemberID).Hidden(true);
                })
                 .DataSource(dataSource => dataSource
                            .Ajax()
                            .Read(read =>
                            {
                                read.Action("DoMemberSelectSearch", "MemberSearch");
                                read.Data("additionalDataSelect");
                            }))
                 .Selectable()
                 .Scrollable(scroll => scroll.Height(250))
                 .AutoBind(false)
                )

// Controller
[HttpPost]
        public ActionResult DoMemberSelectSearch([DataSourceRequest(Prefix = "DoMemberSelectSearch")]DataSourceRequest request, string clientid, string memberid)
        {
            var clientId = Convert.ToInt32(clientid);
            var memberId = Convert.ToInt32(memberid);
            
            var results = _memberSearchRepository.Search(clientId, memberId);
            var data = results.ResultSet;

            DataSourceResult result = data.ToDataSourceResult(request);

            JsonResult jresult = GetJsonResult(result, true);
            return jresult;
        }

// Ajax
var searchRequest = $.ajax({
                url: '@Url.RouteUrl(new { controller = "MemberSearch", action = "DoMemberSelectSearch" })',
                datatype: "json",
                type: "POST",
                data: json,
                success: function(data, textStatus, jqXHR) {
                
                    var grid = $("#Assessments").data("kendoGrid");
                    if (data.Data.length != 0)
                    {                   
                        
                        CloseBusyDialog();
                        setTimeout($("#dialog").dialog("open"), 1000);
                        grid.bind(data.Data);
                    }
                                              
                },
                error: function(jqXHR, textStatus, errorThrown) {
                
                    alert("An AJAX error occurred while searching member assessments.");
                              
                }
        })   

[Dimiter Madjarov]

Hi Eric,


I assume that the reason for the issue is in the success event handler of the AJAX request. If you would like to set the new data for the Grid, you should use the data() method of the Grid's dataSource, instead of the bind method, which is used for event binding.

E.g.

success: function(data, textStatus, jqXHR) {
    var grid = $("#Assessments").data("kendoGrid");
    if (data.Data.length != 0)
    {
        CloseBusyDialog();
        setTimeout($("#dialog").dialog("open"), 1000);
        grid.dataSource.data(data.Data);
    }
}

I hope that this information was helpful for you.

 

Regards,
Dimiter Madjarov
Telerik

[Eric]

Exactly, I wanted to inspect the data before displaying the grid. I found a work around by just doing a read() then inspecting the data in the DataBound event and acting accordingly. Which I guess is the same thing done a different way. The information is helpful anyway in case I want to change the data or build a data set in script and assign it to a grid.