This is a migrated thread and some comments may be shown as answers.
Kendo grid (read) not calling controller
2 Answers 181 Views
This is a migrated thread and some comments may be shown as answers.
Freddy
Top achievements
Rank 1
Freddy asked on 16 Aug 2017, 12:44 PM

Hello.  

I am new to kendo.  I think I have setup my grid correctly, but for some reason when I hit the refresh button, my grid is using cached data and never calls the controller to get new data.  

When the page loads, the controller method gets called and the initial set of data is retrieved.  If I perform an action (lets say I added a row to my database, then call read(), the onTransportRead method gets called, but it never hits the controller to get the dataset.  It's like it's using cached data.

What am I doing wrong?

Controller:  (I modifed the method to make it more simple here, and I know it works b/c the inital (autobind: true) method returns a set of data.  It's just subsequent calls to read() do not call GetKeys).

public JsonResult GetKeys() {
  RestClient client = RestClient;
  RestRequest getRequest = new RestRequest(string.Format("api/filemanagment/{0}/keys"), Method.GET);
 
  string token = ClaimsPrincipal.Current.Claims.FirstOrDefault(o => o.Type == "DbToken").Value;
  getRequest.AddHeader("Authorization", "Basic " + token);
 
  IRestResponse response = client.Execute(getRequest);
  if (response.StatusCode == HttpStatusCode.OK) {
    List<File> returnObj = JsonConvert.DeserializeObject<List<File>>(response.Content);
    return Json(returnObj, JsonRequestBehavior.AllowGet);
  }
  else {
    JsonResultCode jrc = Newtonsoft.Json.JsonConvert.DeserializeObject<JsonResultCode>(response.Content);
    switch (jrc.Code) {
      case 4:
        throw new Exception("Invalid Token");
      default:
        throw new Exception(jrc.ErrorMessage);
    }
  }
}

Page Layout

@model Models.AuthTokenModel
@{
    ViewBag.Title = "KeyList";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<head>
  <script src="~/Scripts/kendo/kendo.data.min.js"></script>
  <script src="~/Scripts/kendo/kendo.grid.min.js"></script>
  <script src="~/Scripts/kendo/kendo.selectable.min.js"></script>
  <script src="~/Scripts/kendo/kendo.columnsorter.min.js"></script>
 
  <link rel="stylesheet" href="~/content/kendo/kendo.common.min.css" />
  <link rel="stylesheet" href="~/Content/kendo/kendo.default.min.css" />
</head>
 
<h2>My Files</h2>
 
<div style="text-align:right">
  <button onclick="return getKeys()">Refresh</button>
</div>
 
<div style="margin-top:5px" id="keyList"></div>
 
<script type="text/javascript">
  var _url = "@Model.URL";
  var _clientVersion = "";
 
 
  $(document).ready(function() {
    var url = _url + "/Home/GetKeys";
 
    $("#keyList").kendoGrid({
      autoBind: true,
      selectable: false,
      height: 500,
      dataSource: {
        type: "json",
        serverFiltering: true,
        transport: {
          read: onTransportRead
        },
        schema: {
          model: {
            fields: {
              Filename: { type: "string" },
              Filesize: { type: "string" },
              Date: { type: "date" },
              ExpirationDate: { type: "date" },
              Key: { type: "string" }
            }
          }
        },
        aggregate: [{
          field: "Filesize",
          aggregate: "sum"
        }]
      },
      columns: [
        { field: "Filename", title: "File Name" },
        {
          field: "Filesize", title: "Size in KB",
          footerTemplate: "Total: #=sum#K"
        },
        {
          field: "Key", title: "Key"
        },
        { field: "Date", title: "Date Uploaded", format: "{0:MM/dd/yyyy}" },
        { field: "ExpirationDate", title: "Expiration Date", format: "{0:MM/dd/yyyy}" },
        {
          width: 250,
          title: "Actions",
          template: $("#template").html()
        }
      ]
    });
  });
 
  function onTransportRead(options) {
    $.ajax({
      url: _url + "/Home/GetKeys",
      dataType: "json",
      data: {
         
      },
      success: function (result) {
        options.success(result);
      }
    });
  }
 
  function getKeys() {
    var gridDS = $("#keyList").data("kendoGrid").dataSource;
    gridDS.read();
 
    return false;
  }
 
</script>
<script id="template" type="kendoui/template">
  <button onclick="return deleteFile('#= Key #')" class="ob-click-me k-button">Delete</button>
  <button onclick="return changeFilePassword('#= Key #');" class="ob-click-me k-button">Change Password</button>
</script>

2 Answers, 1 is accepted

Sort by
0
Freddy
Top achievements
Rank 1
answered on 16 Aug 2017, 03:20 PM

Found the problem.  Needed to set the 

cache: false in the transport.read

0
Preslav
Telerik team
answered on 18 Aug 2017, 07:43 AM
Hi Freddy,

Thank you for sharing the solution with the community.

Please, let us know if you require any further information on the topic.

Regards,
Preslav
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Freddy
Top achievements
Rank 1
Answers by
Freddy
Top achievements
Rank 1
Preslav
Telerik team
Share this question
or