Загрузка значка для сетки пользовательского интерфейса Kendo

Я новичок с KendoUI, и у меня есть некоторые проблемы с прогрессом изображения, которое должно появиться в то же время при загрузке данных.Загрузка значка для сетки пользовательского интерфейса Kendo

Это мой HTML:

<div> 
    <article > 
     <h5>Anagrafica</h5> 
    </article> 
    <div id="gridRolesT" class="dcmo_grid" 
     kendo-grid="gridRoles" 
     k-options="vm.gridOptions" 
     k-on-change="vm.onSelection(kendoEvent)"> 
    </div> 
</div>

Начиная с которой я объявил следующий CSS и контроллер:

CSS:

.dcmo_grid { 
margin: 10px 0px; 
} 

/*style for selected item*/ 
.dcmo_grid table tr.k-state-selected 
{ 
    background: #428bca; 
    color: #fff; 
} 

/*style for selected pages*/ 
.dcmo_grid .k-pager-numbers span.k-state-selected 
{ 
    background: #428bca; 
    color: #fff; 
    border-color: #428bca; 
}

CONTROLLER:

constructor(private $scope) { 
     super($scope); 

     $scope.vm = this; 

     $("#gridRolesT").kendoGrid(); 

     this.GetRoles(); 

    } 

gridOptions = { 
     dataSource: new kendo.data.DataSource(
      { 
       pageSize: 5 
      }) 
     , 
     columns: [ 
      { field: 'IdRole', title: 'Role' }, 
      { field: 'DsRole', title: 'Description' } 
     ], 
     pageable: { 
      pageSizes: true 
     }, 
     filterable: true, 
     sortable: true, 
     selectable: "row", 
     scrollable: false 
} 

public GetRoles() { 
     var self = this; 

     kendo.ui.progress($("#gridRolesT"), true); 
     this.AppController.AdministrationService.GetRoles() 
      .success(function (data) { 
       self.populateRole(data); 
       kendo.ui.progress($("#gridRolesT"), false); 
      }) 
      .error(function (data) { 
       kendo.ui.progress($("#gridRolesT"), false); 
       self.ErrorMessage = "Errore caricamento dati"; 
      }); 
    }

Я для и в Интернете, чтобы иметь значок прогресса во время загрузки данных, я должен использовать kendo.ui.progress ($ («# gridID»), статус), но это не работает в моем случае ,

Я также попытался изменить положение контейнера моей сетки (как предложено в некоторых сообщениях в Интернете), но я достиг каких-либо результатов.

Есть ли кто-нибудь из вас, который мог бы дать мне предложение?

Спасибо заранее

Деби

источник

2014-08-01 Deby

Вы хотите показать прокрестность или просто вращающееся колесо во время загрузки? Если это так, отметьте [это] (http://stackoverflow.com/a/17794634/1802671) другой вопрос/ответ – OnaBai

Вращающееся колесо - это то, что я хочу. Я не знаю, как я мог применить ваше предложение, потому что в моем dataSource объявлен в gridOption только как новый файл kendo.data.DataSource, но фактическая загрузка данных выполняется в рамках метода populateRole, показанного выше: «public populateRole (данные) { var dataSource = new kendo.data.DataSource ({ данные: данные }); dataSource.read(); this.gridOptions.dataSource.data (dataSource.data()); } «Как я могу применить наше предложение в этом случае? – Deby

Позволяет понять, понимаю ли вы, что вы делаете, так как кажется мне довольно сложным. Вы создаете поддельный DataSource, а затем при вызове 'GetRoles', когда вы на самом деле создаете _Good_ DataSource. Верный?Вы считали установку 'autoBind'' ложью' в определении 'Grid', чтобы он ничего не загружал, пока вы не вызываете' read' в DataSource? – OnaBai

-1

Я использовал код, приведенный ниже, прежде чем переключить значок загрузки на кендо сетке.

Shows loading image 
$('#myGrid').data('kendoGrid')._progress(1);

Hides loading image 
$('#myGrid').data('kendoGrid')._progress(0);

источник

2014-08-01 17:22:18

Спасибо, Джонатан; Я попробовал ваше предложение, но это не сработает! :( – Deby

Я нашел проблему!

Я instatiated кендо сетки в конструкторе моего класса, например, как показано ниже:

constructor(private $scope) { 
     super($scope); 

     $scope.vm = this; 

     $("#gridRolesT").kendoGrid(); 

     this.GetRoles(); 

    }

Удаление объявления из конструктора и сохранить метод kendo.ui.progress($(NameElement), state), как показано в посте выше, и все идет хорошо!

Большое вам спасибо за помощь!

Deby

источник

2014-08-05 07:14:00 Deby

Загрузка значка для сетки пользовательского интерфейса Kendo

ответ

Смежные вопросы