Перезагрузка/обновление сетки Kendo

Ответ 1

Ты можешь использовать

$('#GridName').data('kendoGrid').dataSource.read(); <!--  first reload data source -->

$('#GridName').data('kendoGrid').refresh(); <!--  refresh current UI -->

Ответ 2

Я никогда не обновляюсь.

$('#GridName').data('kendoGrid').dataSource.read();

один работает для меня все время.

Ответ 3

$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();

Ответ 4

В недавнем проекте мне пришлось обновить Grid Kendo UI Grid на основе некоторых вызовов, которые происходили при некоторых выпадающих меню. Вот что я в итоге использовал:

$.ajax({
        url: '/api/....',
        data: { myIDSArray: javascriptArrayOfIDs },
        traditional: true,
        success: function(result) {
            searchResults = result;
        }
    }).done(function() {
        var dataSource = new kendo.data.DataSource({ data: searchResults });
        var grid = $('#myKendoGrid').data("kendoGrid");
        dataSource.read();
        grid.setDataSource(dataSource);
    });

Надеюсь, это сэкономит вам время.

Ответ 5

Ни один из этих ответов не получает тот факт, что read возвращает обещание, что означает, что вы можете подождать загрузки данных, прежде чем вызывать обновление.

$('#GridId').data('kendoGrid').dataSource.read().then(function() {
    $('#GridId').data('kendoGrid').refresh();
});

В этом нет необходимости, если захват данных происходит мгновенно/синхронно, но, скорее всего, он поступает с конечной точки, которая не вернется немедленно.

Ответ 6

Если вы не хотите иметь ссылку на сетку в обработчике, вы можете использовать этот код:

 $(".k-pager-refresh").trigger('click');

Это обновит сетку, если есть кнопка обновления. Кнопка может быть включена так:

[MVC GRID DECLARATION].Pageable(p=> p.Refresh(true))

Ответ 7

Собственно, они разные:

• $('#GridName').data('kendoGrid').dataSource.read() обновляет атрибуты uid строки таблицы

• $('#GridName').data('kendoGrid').refresh() оставляет тот же uid

Ответ 8

В моем случае у меня был настраиваемый URL-адрес, чтобы идти каждый раз; хотя схема результата останется прежней.
Я использовал следующее:

var searchResults = null;
$.ajax({
        url: http://myhost/context/resource,
        dataType: "json",
        success: function (result, textStatus, jqXHR) {
            //massage results and store in searchResults
            searchResults = massageData(result);
        }
    }).done(function() {
        //Kendo grid stuff
        var dataSource = new kendo.data.DataSource({ data: searchResults });
        var grid = $('#doc-list-grid').data('kendoGrid');
        dataSource.read();
        grid.setDataSource(dataSource);
    });

Ответ 9

Что вам нужно сделать, это просто добавить событие .Events(события = > events.Sync( "KendoGridRefresh" )) в коде привязки kendoGrid. Не нужно писать код обновления в результате ajax.

@(Html.Kendo().Grid<Models.DocumentDetail>().Name("document")
    .DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .Model(model => model.Id(m => m.Id))        
    .Events(events => events.Sync("KendoGridRefresh"))    
    )
      .Columns(columns =>
      {
          columns.Bound(c => c.Id).Hidden();              
          columns.Bound(c => c.UserName).Title(@Resources.Resource.lblAddedBy);                           
      }).Events(e => e.DataBound("onRowBound"))
          .ToolBar(toolbar => toolbar.Create().Text(@Resources.Resource.lblNewDocument))
          .Sortable()          
          .HtmlAttributes(new { style = "height:260px" })          
  )

И вы можете добавить следующую глобальную функцию в любой из вашего .js файла. поэтому вы можете вызвать его для всех сеток кендо в своем проекте, чтобы обновить kendoGrid.

function KendoGridRefresh() {
    var grid = $('#document').data('kendoGrid');
    grid.dataSource.read();
}

Ответ 10

Я использовал Jquery.ajax для получения данных. Чтобы перезагрузить данные в текущую сетку, мне нужно сделать следующее:

.success (function (result){
    $("#grid").data("kendoGrid").dataSource.data(result.data);
})

Ответ 11

Вы можете использовать следующие строки

$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();

Для функции автоматического обновления посмотрите здесь

Ответ 12

Используя следующий код, он автоматически называется методом чтения сетки и снова заполняет сетку

$('#GridName').data('kendoGrid').dataSource.read();

Ответ 13

Альтернативный способ перезагрузки сетки:

$("#GridName").getKendoGrid().dataSource.read();

Ответ 14

Вы всегда можете использовать $('#GridName').data('kendoGrid').dataSource.read();. После этого вам не нужно .refresh();, .dataSource.read(); выполнит трюк.

Теперь, если вы хотите обновить свою сетку более чем на angular, вы можете сделать:

<div kendo-grid="vm.grid" id="grid" options="vm.gridOptions"></div>

vm.grid.dataSource.read();`

ИЛИ

vm.gridOptions.dataSource.read();

И не забудьте объявить свой источник данных как kendo.data.DataSource type

Ответ 15

Я хочу вернуться на страницу 1, когда обновляю сетку. Просто вызов функции read() будет держать вас на текущей странице, даже если новые результаты не содержат столько страниц. Вызов .page(1) на источнике данных обновит источник данных и вернется на страницу 1, но не сработает на сетках, которые не являются доступными для страницы. Эта функция обрабатывает оба:

function refreshGrid(selector) {
     var grid = $(selector);
     if (grid.length === 0)
         return;

     grid = grid.data('kendoGrid');
     if (grid.getOptions().pageable) {
         grid.dataSource.page(1);
     }
     else {
         grid.dataSource.read();
     }
}

Ответ 16

Чтобы выполнить полное обновление, где сетка будет повторно отображаться вместе с новым запросом на чтение, вы можете сделать следующее:

 Grid.setOptions({
      property: true/false
    });

Если свойство может быть любым свойством, например. сортируемый

Ответ 17

Вы можете попробовать:

    $('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();

Ответ 18

Если вы хотите, чтобы сетка автоматически обновлялась по времени, вы можете использовать следующий пример с интервалом, установленным в 30 секунд:

   <script type="text/javascript" language="javascript">
      $(document).ready(function () {
         setInterval(function () {
            var grid = $("#GridName").data("kendoGrid");
            grid.dataSource.read();
         }, 30000);
      });
   </script>

Ответ 19

Просто напишите ниже код

$('.k-i-refresh').click();

Ответ 20

$("#theidofthegrid").data("kendoGrid").dataSource.data([ ]);

Ответ 21

Установленная по умолчанию/обновленная конфигурация/данные виджетов автоматически привязывается к соответствующему источнику данных.

$('#GridId').data('kendoGrid').dataSource.read();
$('#GridId').data('kendoGrid').refresh();

Ответ 22

Вы также можете обновить свою сетку, отправив новые параметры в действие "Чтение" и установив нужные страницы:

var ds = $("#gridName").data("kendoGrid").dataSource;
ds.options.page = 1;
var parameters = {
    id: 1
    name: 'test'
}
ds.read(parameters);

В этом примере действие чтения сетки вызывается значением 2 параметров, и после получения результата разбиение сетки происходит на странице 1.

Ответ 23

Самый простой выход для обновления - использовать функцию refresh(). Который идет как:

$('#gridName').data('kendoGrid').refresh();

в то время как вы также можете обновить источник данных с помощью этой команды:

$('#gridName').data('kendoGrid').dataSource.read();

Последний фактически перезагружает источник данных сетки. Использование обоих может быть сделано в соответствии с вашими потребностями и требованиями.

Ответ 24

$("#grd").data("kendoGrid").dataSource.read();