Kendo UI Grid rendering from JSON data not working

9 posts, 0 answers
  1. Kris Nobels
    Kris Nobels avatar
    17 posts
    Member since:
    Aug 2009

    Posted 28 May 2013 Link to this post

    Hello,

    I have a problem with my kendo UI Grid visualize the JSON content.

    Here is my code from the view:

    @(Html.Kendo().Grid<Models.SellerModel>()
        .Name("Sales")
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("GetSales", "Beheer"))
            .Model(model => model.Id(p => p.Id))
         )
         .Columns(columns =>
        {
            columns.Bound(o => o.Id).Width(60);
            columns.Bound(o => o.Firstname).Width(90);
            columns.Bound(o => o.Surename).Width(220);
            columns.Bound(o => o.Emailaddress).Width(280);
            columns.Bound(o => o.Mobile).Width(110);
            columns.Bound(o => o.RegionId).Width(110);
            columns.Bound(o => o.Deleted).Width(110);
        })
    )

    This is the JSON:
    [{"Id":1,"Surname":"blablabla","Firstname":"Kris","Mobile":"545645644654","Emailaddress":"test@hotmail.com","RegionId":3,"Deleted":false}]

    But i searched on the forum and i changed to this
    {data:[{'Id':1,'Surname':'blablabla','Firstname':'Kris','Mobile':'545645644654','Emailaddress':'test@hotmail.com','RegionId':3,'Deleted':false}]}

    Still no progress here. :-(

    What is wrong here ?
    Because i only have headers as result. :-(

    Can anyone tell me what i need to do or change ?
  2. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 29 May 2013 Link to this post

    Hello,

     The problem is that the result isn't in the format expected by Kendo Grid for ASP.NET MVC. I recommend checking the ajax binding help topic which shows how to convert an IEnumerable to DataSourceResult which is rerialized to the expected format.

    Regards,
    Atanas Korchev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kris Nobels
    Kris Nobels avatar
    17 posts
    Member since:
    Aug 2009

    Posted 07 Jun 2013 Link to this post

    Thanks it works now :-)
  4. Mark
    Mark avatar
    5 posts
    Member since:
    Dec 2014

    Posted 22 Dec 2014 Link to this post

    I have the same issue. However it is not fixed by the Ajax method, I followed 'Using View Models' of the Ajax Binding page to the letter. Incidentally I needed the View model due to the annoying 'circular reference issue'.

    I have enabled AllowGet (return Json(result, JsonRequestBehavior.AllowGet);) so I can see what is returned when I go to the Read action method directly. It returns what appears to be properly formatted JSON of my data (there are 4 records correctly present).

    However the grid refuses to show any data at all, just headers. Any troubleshooting tools I can use to find out why?

    Thanks

  5. Mark
    Mark avatar
    5 posts
    Member since:
    Dec 2014

    Posted 22 Dec 2014 in reply to Mark Link to this post

    Nevermind - seems the AllowGet prevented it from working. Removed it and all ok now.
  6. Bhavesh
    Bhavesh avatar
    1 posts
    Member since:
    May 2017

    Posted 09 Feb 2018 Link to this post

    I'm having the same issue. Used the View Model to eliminate the circular reference error.  Tried return without the AllowGet, but get the error: "his request has been blocked because sensitive information could be disclosed to third party web sites when this is used in a GET request. To allow GET requests, set JsonRequestBehavior to AllowGet."  Kendo.Mvc version 2018.1.117.545

    Action code:

        public ActionResult StudentAccountsDataRead([DataSourceRequest]DataSourceRequest request)
        {
          IQueryable<StudentAccountViewModel> studentAccounts = StudentAccountClass.GetAllStudentAccounts();
          return Json(studentAccounts.ToDataSourceResult(request));
        }

    Index code:

            @(Html.Kendo().Grid<StudentAccountViewModel>()
                        .Name("GridAccounts")
                        .Columns(columns =>
                        {
                            columns.Bound(s => s.StudentAccountId).Title("Acct Id");
                            columns.Bound(s => s.CASId).Groupable(false).Title("CAS Id");
                            columns.Bound(s => s.StudentEmail).Title("Email");
                            columns.Bound(s => s.AccountInfoReceived).Title("Info Received");
                            columns.Bound(s => s.Retries).Title("# Emails Sent");
                            columns.Bound(s => s.AccountCreateDate).Title("Acct Date");
                        })
                        .Sortable()
                        .DataSource(dataSource => dataSource
                        .Ajax()
                        .Read(read => read.Action("StudentAccountsDataRead", "Account").Type(HttpVerbs.Get))
                        .PageSize(20)
                    )
            )

    GetAllStudentAccounts code:

        public static IQueryable<StudentAccountViewModel> GetAllStudentAccounts()
        {
          var dbctx = new StudentAccountAddEntities();
          try
          {
            return dbctx.StudentAccounts.Include(s => s.UtlAcademicYear).Select(account => new StudentAccountViewModel
            {
              StudentAccountId = account.StudentAccountId,
              StudentYear = account.StudentYear,
              StudentUniqueId = account.StudentUniqueId,
              StudentEmail = account.StudentEmail,
              AccountInfoReceived = account.AccountInfoReceived,
              Retries = account.Retries,
              AccountCreateDate = account.AccountCreateDate,
              AcademicYear = account.UtlAcademicYear.AcademicYear
            });
          }
          catch(Exception ex)
          {
            return null;
          }
        }

  7. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 13 Feb 2018 Link to this post

    Hello,

    I guess that the problem here is missing to include a reference to the kendo.aspnetmvc.min.js script. Please refer to the https://docs.telerik.com/aspnet-mvc/helpers/grid/troubleshoot/known-exceptions#sensitive-information-error-message article for more information. 

    Regards,
    Boyan Dimitrov
    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.
  8. Tariq
    Tariq avatar
    5 posts
    Member since:
    Mar 2020

    Posted 01 Apr 2020 in reply to Boyan Dimitrov Link to this post

     https://docs.telerik.com/aspnet-mvc/helpers/grid/troubleshoot/known-exceptions#sensitive-information-error-message 

    page not found

     

     
  9. Nikolay
    Admin
    Nikolay  avatar
    324 posts

    Posted 03 Apr 2020 Link to this post

    Hello Tariq,

    Here is the correct link to the article:

    Let me know if you have any questions.

    Regards,
    Nikolay
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top