[Solved] Grid does not display data

[Bill]

I am using version 2011.2.914 of the controls. Whenever I try to bind data from my controller to a view, I can't get the data inside the collection to display on the grid. I get the "No records to display" message.

I want to point out that if I am not using the Telerik grid, the data comes out fine (see below):
Controller
IEnumerable<YeagerTechWcfService.Customer> customerList = db.GetCustomers();
                    return View("Index", customerList);

See the attached index.zip file for the code in the View.


I have tried ServerSide and Ajax Binding. Both don't work. I have searched the Telerik site and the web and can't find out what is missing.

What do I need to do in order to resolve this and get the data in my grid?

Here is the code in my Customer controller for the Ajax binding (which is what I really want). Upon return of getting the data, you can see in the attached customerlist.png file that the data is in the customerList collection.
When the View is being rendered, I captured the attached grid.png file.
When cycling through the grid during the binding, I captured the attached gridcode.png file.

using Telerik.Web.Mvc; 

public class CustomerController : Controller
    {

[GridAction]
        public ActionResult Index()
        {
                    IEnumerable<YeagerTechWcfService.Customer> customerList = db.GetCustomers();

                    return View(new GridModel<YeagerTechWcfService.Customer>
                    {
                        Data = customerList
                    });
                         
        }
}

Below, is the code in my associated View. btw, all the bound columns have intellisense that pop up for the columns in my model. This is for the Index action within the Customer controller.

@model Telerik.Web.Mvc.GridModel<YeagerTech.YeagerTechWcfService.Customer>
@{
    ViewBag.Title = "Customer Index";
}
<h2>
    Customer Index</h2>
<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table>
    @(Html.Telerik().Grid<YeagerTech.YeagerTechWcfService.Customer>()
  .Name("Customers")
  .Columns(columns =>
{
    columns.Bound(o => o.Email);
    columns.Bound(o => o.Company);
    columns.Bound(o => o.FirstName);
    columns.Bound(o => o.LastName);
    columns.Bound(o => o.Address1);
    columns.Bound(o => o.Address2);
    columns.Bound(o => o.City);
    columns.Bound(o => o.State);
    columns.Bound(o => o.Zip);
    columns.Bound(o => o.HomePhone);
    columns.Bound(o => o.CellPhone);
    columns.Bound(o => o.Website);
    columns.Bound(o => o.IMAddress);
    columns.Bound(o => o.CreatedDate).Format("{0:MM/dd/yyyy}");
    columns.Bound(o => o.UpdatedDate).Format("{0:MM/dd/yyyy}");
}).DataBinding(dataBinding => dataBinding.Ajax().Select("Index", "Customer"))
.Pageable()
.Sortable()
.Scrollable()
.Resizable(resizing => resizing.Columns(true))
.Filterable())
</table>

[Bill]

Telerik, any answer on this one yet?

I'm completely "dead in the water" on using the MVC controls until I know what is causing this....

Thanks in advance,

Bill

[Garðar Valur]

Hi Bill.

The reason your intellisense show you the columns to bind within the customer table is simply because you declare it within the telerik grid angle brackets <>, by declaring the grid that way you are basically telling the grid the way your model should look like.

Anyway, I´m also fighting a similar problem as you.  I created a test project to display a single table within the grid.  I followed the instructions from the telerik website (instructions for batch editing in grid) and got everything to work for me.  I´m using Linq to SQL entity and everything was working fine.  When I added a new table with a foreign key constrain between the old table and the new table, the grid stopped displaying the data (the same error you have).  I didn´t change anything else from my project, and what I can´t understand is why the grid immediately stops displaying data when I add another table do the entity class.  No other changes.

Sorry, I didn´t mean to talk about my problem  :)

Within your telerik,grid, don´t you need some sort of a DataKey within the grid?

.DataKeys(keys =>
              {
                  keys.Add(p => p.EmployeeID).RouteKey("CustomerID");
              })

[Bill]

Thanks Garðar...

The point I was trying to make with the intellisense was to prove that their is nothing wrong with the model....

Like you, this entity (Customer) has a foreign key relationship to another entity - Projects (even though I am explicity not bringing anything back from the database for this other table). I have lazy loading turned off for this particular method call.

So, if you look at my customerlist.png attached file, you'll see the Customer entity in it with a reference to the Projects entity which has a count of 0 records.

I put the DataKeys property inside the grid and got the same results. I had purposely left it out, because I do not have any links to click on for details, etc. I only would need this if I was going to do something with a specific customer.

Telerik, how do we process records in the grid based on these scenarios? 

In my situation, it's basically bringing back the Customer table without any related records (by design).

[Bill]

Putting the (Model.Data) solved the issue!!! Telerik should update their docs to reflect this which is not found anywhere....

@(Html.Telerik().Grid<YeagerTech.YeagerTechWcfService.Customer>(Model.Data) 

In addition, when the data is displayed, it's all squished together and not aligned with the grid columns. 
I thought maybe it might be not haveing the Telerik stylesheets on the page.
However, I have the following in my _Layout.cshtml file and still getting the same result.

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />     
<link href="../../Content/2011.2.712/telerik.common.min.css" rel="stylesheet" type="text/css" />     
<link href="../../Content/2011.2.712/telerik.windows7.min.css" rel="stylesheet" type="text/css" />


Is there a property on the grid I also need to set to take care of this (see attachment)?

[Bill]

I am using v 712 and I was referring to 914... That solved the data problem.

However.... the data now populates across the entire grid (which is what I want), but now the columns are squished together and not in alignment with the grid data (see attached file).

Is there a Telerik property I need to set for this or is it still a CSS issue?