Telerik Forums
Kendo UI for jQuery Forum
2 answers
1.6K+ views

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>
Preslav
Telerik team
 answered on 18 Aug 2017
4 answers
154 views

Hi,

Is it possible to do chart orientation from horizontal to vertical

All examples that are provided are horizontal, from left to right or right to left.

Is there a way to display the chart in vertical from top to bottom,

Please see the attachment

 

 

Shan
Top achievements
Rank 1
 answered on 17 Aug 2017
4 answers
435 views
I just bought Kendo UI Web package from your website 
and I have dowloaded kendoui.web.2012.3.1315.commercial.zip file
BUT i cannot find KendoUI.Mvc.dll file?

Michael
Top achievements
Rank 1
 answered on 17 Aug 2017
5 answers
826 views

Hi,

As my title suggests I'd like to be able to pragmatically update the date and the view in a Schedule without the DataSoruce automatically reloading after each one is set.

I use a remote datasource and its a waste of resources for me to set the date and the scheduler reads the datasource, then I set the view and the scheduler reads the datasource again.I tried using the one() to preventDefault on navigate before settign either the view or date, but that had no affect. Example here, http://dojo.telerik.com/aHutu

Any advise would be appreciated.

Thanks and kind regards, 
Grant

Grant
Top achievements
Rank 3
Iron
Iron
Iron
 answered on 17 Aug 2017
1 answer
466 views

Hi,

I'm currenty using MVVM across all my UI and it's working great but I have one small issue with a button inside a footer template which doesn't call the function inside my view model.

I include in attachment an example showing my issue.

Dimitar
Telerik team
 answered on 17 Aug 2017
4 answers
309 views

Hello,

I added to my project kendo.all.d.ts file (Type definitions for Kendo UI Professional v2017.2.621), but I have bunch of errors.

TypeScript version: 2.4.1

Dimitar
Telerik team
 answered on 17 Aug 2017
1 answer
116 views

I have an MVC application where i display a table that has a date column, the other columns work fine, but the dates are not showing!! also when i try to modify a filter in columns it's not working! please help

 

here's my view :

<div class="col-sm-12">
                    <table id="grid2"  >
                        <thead>
                            <tr role="row">
                                <th data-field="VersPrevu_Numero" data-filterable="false" class="sorting_asc" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Rendering engine: activate to sort column descending">@Html.DisplayNameFor(model => model.VersPrevu_Numero)</th>
                                <th data-field="VersPrevu_Reference" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.VersPrevu_Reference) </th>
                                <th data-field="Fact_Nom" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.LOGE_FACTURABLE.Fact_Nom) </th>
                                <th data-field="VersPrevu_DatePrevu" data-type="date" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.VersPrevu_DatePrevu)</th>
                                <th data-field="VersPrevu_Remise" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.VersPrevu_Remise)</th>
                                <th data-field="VersPrevu_Montant" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.VersPrevu_Montant)</th>
                                <th data-field="VersPrevu_Estdu" data-filterable="false" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.VersPrevu_Estdu)</th>
                                <th data-field="VersPrevu_EstRegle" data-filterable="false" class="sorting" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" >@Html.DisplayNameFor(model => model.VersPrevu_EstRegle)</th>
                                <th data-field="Ve" class="sorting" data-filterable="false" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending" ></th>
                            </tr>
                      </thead>
                        <tbody>
                            @foreach (var item in Model)
                            {
                                <tr role="row" class="odd">
                                    <td>
                                        @Html.DisplayFor(modelItem => item.VersPrevu_Numero)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.VersPrevu_Reference)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.LOGE_FACTURABLE.Fact_Nom)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.VersPrevu_DatePrevu)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.VersPrevu_Remise)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.VersPrevu_Montant)
                                    </td>
                                    <td>
                                        @Html.CheckBoxFor(modelItem => item.VersPrevu_Estdu)
                                    </td>
                                    <td>
                                        @Html.CheckBoxFor(modelItem => item.VersPrevu_EstRegle)
                                    </td>
                                    @*<td>
                                            @Html.ActionLink("Edit", "Edit", new { id=item.VersPrevu_Id }) |
                                            @Html.ActionLink("Details", "Details", new { id=item.VersPrevu_Id }) |
                                            @Html.ActionLink("Delete", "Delete", new { id=item.VersPrevu_Id })
                                        </td>*@
                                    @if (item.VersPrevu_Estdu == true)
                {
                                        <td>
                                            @Html.ActionLink("Payer", "Create", "LOGE_Reglement", new { Id = item.VersPrevu_Id }, null)
                                        </td>
                                    }
                                    else
                                    {
                                        <td>
                                            @Html.ActionLink("Détails", "Details", "LOGE_VersementPrevu", new { Id = item.VersPrevu_Id }, null)
                                        </td>
                                    }
                                </tr>
                            }
                        </tbody>
                    </table>
                </div>

THE SCRIPT : 

 

<script>
    $(document).ready(function () {
        kendo.culture("fr-FR");

    });
        $(document).ready(function () {
            $("#grid2").kendoGrid({
                dataSource: {
                    
                    schema: {
                        model: {
                            fields: {
                                VersPrevu_Numero: { type: "number" },
                                VersPrevu_Reference: { type: "string" },
                                Fact_Nom: { type: "string" },                               
                                VersPrevu_DatePrevu: { type: "date" },
                                VersPrevu_Remise: { type: "number" },
                                VersPrevu_Montant: { type: "number" }
                                //VersPrevu_Estdu: { type: "boolean" },
                                //VersPrevu_EstRegle: { type: "boolean" }
                            }
                        }
                    },
                    pageSize: 20
                },
                height: 430,
                sortable: true,
                filterable: {
                    mode: "row"
                },
                pageable: {
                    messages: {
                        empty: "No items to display"
                    },
                    input: false,
                    refresh: true,
                    pageSizes: true,
                    pageSizes: [10, 20, 30, 50],

                    columns:
                    [{
                        field: "VersPrevu_Numero",
                        filterable: false,
                    },
                   {
                       field: "VersPrevu_Reference",
                       filterable: {
                           cell: {
                               operator: "gte"
                           }
                       }
                   }, {
                       field: "VersPrevu_DatePrevu",
                       format: "{0:dd/MM/yyyy}"
                   }, {
                       field: "VersPrevu_Remise"
                   }, {
                       field: "VersPrevu_Montant"
                   }, {
                       field: "VersPrevu_Estdu"
                   }, {
                       field: "VersPrevu_EstRegle"
                   }]              

                } });

            //$("#grid").data("kendoGrid").dataSource.pageSize(10);
        });      
</script>

 

 

Stefan
Telerik team
 answered on 17 Aug 2017
2 answers
268 views

When first time select repeat on month or year the date will same as event start date,

but when I change the event  start date I want recurrence's date will change 

How to do that?

Dimitar
Telerik team
 answered on 16 Aug 2017
1 answer
211 views

Hi Kendo folks,

I find the clear button on the MultiSelect control quiet odd in tag mode - it only clears only the last selected item on each click. So if I have 60 items selected, that means I need to click the clear button 60 times. This is against convention - user would expect clear button should clear all selected. 

Is this a bug? Do you guys intend to fix this?

Thanks,

 

Anna

Ivan Danchev
Telerik team
 answered on 16 Aug 2017
1 answer
356 views

We are running into a (I think) simple issue with Kendo UI Grid.

Situation is best explained using an image (see attached).

My grid has 4 columns: ID, External Code, Manufacturer,Type.
When I sort, everything works fine, no issues.

When we hide the "External Code"-column (the second column) the table reloads and all is well. 

Now, when we sort on the NEW second column (Manufacturer) the following happens:
1. [Correct] The grid is sorted properly
2. [Correct] The Manufacturer table header gets the 'k-sorted' class, making it blue, showing an arrow 
3. [Issue] The k-sorted class is added to the wrong <col> in the table body <colgroup> definition.

In this case it's adding k-sorted to the third column - which is the original position of the manufacturer column.

Is this a bug in kendo, or are we doing it wrongâ„¢?

Additional info

- We're using the latest kendo javascript library.
- We're hiding/showing columns using the $("#grid").data("kendoGrid").hideColumn("internalColumnName") API

 

Please advise,

Jan Herman
Top achievements
Rank 1
 answered on 16 Aug 2017
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
ScrollView
Switch
TextArea
BulletChart
Licensing
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
ContextMenu
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?