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

Question

Я использую asp.net mvc KENDO GRID код. Я хочу скрыть загружаемое изображение при загрузке сетки и заменить его индикатором прогресса кендо или другим изображением.
А что делать? мы должны четко надстройкой CSS

<div class="OutStandingDetailsGridArea"> 
               @(Html.Kendo().Grid(Model) 
     .Name("OutStandingDetailsGrid") 
     .Columns(column => 
     { 
      column.Bound(x => x.ConsolidatedInvoiceDispatchID).Hidden(true); 
      column.Bound(x => x.ConsolidatedInvoiceNumber).Hidden(true); 

      column.Bound(x => x.PaidAmount) 
       .ClientTemplate("#if(data.PaidAmount<0) {# " + 
              "<span style='color:red' class='OustandingPdAmt'> #=kendo.toString(data.PaidAmount, 'n2')# </span>" + 
            "#}" + 
            "else if(data.PaidAmount>0) {# " + 
              "<span> #=kendo.toString(data.PaidAmount, 'n2')# </span>" + 
            "#}#") 
            .ClientFooterTemplate("<div style='text-align: right' >#= kendo.toString(sum, 'n2') #</div>") 
       .HtmlAttributes(new { style = "text-align:right" }) 

       //.Sortable(false) 
        .Filterable(false); 


     .HtmlAttributes(new { style = "height: 320px;" }) 
      //.Pageable() 
      //.Sortable() 
      //.Filterable() 
      .Scrollable(x=>x.Height(285)) 
      //.Events(events => events.DataBound("onDataBound")) 
     .DataSource(dataSource => dataSource 
        .Ajax() 
        .Aggregates(aggregates => 
         { 
          aggregates.Add(p => p.Amount).Sum(); 
          aggregates.Add(p => p.PaidAmount).Sum(); 
          aggregates.Add(p => p.BalanceAmount).Sum(); 
         } 
         ) 
           //.Read("OutstandingDetailsAgg_Read", "CreditControl") 

        .ServerOperation(false) 
     ) 
    ) 

</div> 

Answer 1

Когда загрузка изображения запускается визуализируются в DOM следующие элементы

<div class="k-loading-mask" style="width:100%;height:100%"><span class="k-loading-text">Loading...</span><div class="k-loading-image"><div class="k-loading-color"></div></div></div> 

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

.k-loading-image{ 
    background-image: url('someotherimage.gif'); 
}