This is a migrated thread and some comments may be shown as answers.

Refresh and paging not working. Getting "do you want to save or download read.json"

5 Answers 135 Views

Grid

This is a migrated thread and some comments may be shown as answers.

DominionZA asked on 05 Sep 2013, 12:42 PM

Hi,

I sent an email to support 2 days ago for this as I was told that emails are responded to within 24 hours. No reply. So trying on the forums now.

I have a grid that has columns dynamically created. It populates just fine.

When attempting to move to the next page or do a refresh, my browser asked me if I want to download or save read.json.

In my other grids with static columns (predefined), it works fine. It is just in this grid where the columns are dynamically created.

How do I fix this?

My View

@using Kendo.Mvc.UI

@model System.Data.DataTable

@{

Layout = null;

}

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8" />

<title>@ViewBag.Title</title>

<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />

<meta name="viewport" content="width=device-width" />

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

<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.common.min.css")" rel="stylesheet" type="text/css" />

<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />

<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.blueopal.min.css")" rel="stylesheet" type="text/css" />

<script src="@Url.Content("~/Scripts/kendo/2013.2.716/jquery.min.js")"></script>

<script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.all.min.js")"></script>

<script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.aspnetmvc.min.js")"></script>

<script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"></script>

</head>

<body style="height: 100%">

<div id="body">

@(Html.Kendo().Grid(Model)

.Name("Grid")

.Columns(columns =>

{

foreach (System.Data.DataColumn column in Model.Columns)

{

columns.Bound(column.ColumnName);

}

})

.Pageable(pager => pager.Refresh(true))

.DataSource(dataSource => dataSource

.Ajax()

.Model(model =>

{

foreach (System.Data.DataColumn column in Model.Columns)

{

model.Field(column.ColumnName, column.DataType);

}

})

.Read(read => read.Action("Read", "View", new { area = "DisplayPanel" }))

)

</div>

</body>

</html>

My Controller

using System;

using System.Web.Mvc;

using Kendo.Mvc.Extensions;

using Kendo.Mvc.UI;

using Smartrail.Application;

using Smartrail.Common;

using Smartrail.Domain.Service.Contracts;

namespace SmartrailWeb.Areas.DisplayPanel.Controllers

{

public class ViewController : Controller

{

public ActionResult Index()

{

using (var uow = ApplicationContext.ServiceLocator.GetInstance<IPresentationUnitOfWork>())

{

var service = ApplicationContext.ServiceLocator.GetService<IDisplayPanelCreatorService>(uow);

return View(service.GetDataSet(new DateTime(1990, 1, 1), null));

}

[HttpGet]

public ActionResult Read([DataSourceRequest] DataSourceRequest request)

{

using (var uow = ApplicationContext.ServiceLocator.GetInstance<IPresentationUnitOfWork>())

{

var service = ApplicationContext.ServiceLocator.GetService<IDisplayPanelCreatorService>(uow);

return Json(service.GetDataSet(new DateTime(1990, 1, 1), null).ToDataSourceResult(request), JsonRequestBehavior.AllowGet);

}

Please would someone respond ASAP. I am falling behind with my deadlines and need to get this sorted out ASAP.

TIA

5 Answers, 1 is accepted

Accepted

answered on 09 Sep 2013, 09:41 AM

Hello Michael,

It is hard to tell what goes wrong just from the code. I assume that there is either a JavaScript in the console when you click the pager, or for some reason the Grid is trying to perform server paging by navigating to the URL instead of paging on the client. We will need a way to reproduce the case to investigate further.

Regarding the second question - it is covered in this code library article:

http://www.kendoui.com/code-library/mvc/grid/ajax-binding-custom-row-styles-based-on-the-data.aspx

To troubleshoot both cases faster, please demonstrate the problem in the code library above (use some dummy static data) so we can run and observe it and advise you further.

Kind Regards,
Petur Subev
Telerik

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

answered on 10 Sep 2013, 10:32 AM

samplewithdynamiccolumnsandautorefresh.zip

Thank you. Your post was very helpful.

I have taken the code sample, modified it to do what I need and am sharing it for those that get stuck.

The sample now creates the columns dynamically using a DataTable. It also auto refreshes the grid every 5 seconds.

answered on 10 Sep 2013, 02:47 PM

Using the above sample, you can set the row style based on a certain condition.

I would like to know how to set the cell style based on a condition and not the entire row. Is this possible?

This is the current code for setting the row style...

function onDataBound(e) {

var grid = $("#Grid").data("kendoGrid");

var gridData = grid.dataSource.view();

for (var rowIndex = 0; rowIndex < gridData.length; rowIndex++) {

//get the item uid

var currentUid = gridData[rowIndex].uid;

//if the record fits the custom condition

if (gridData[rowIndex].Variance < 0) {

//find the row based on the uid and the custom class

var currenRow = grid.table.find("tr[data-uid='" + currentUid + "']");

$(currenRow).addClass("customClass");

}

What do I need to change to set the cell style please?