如何在数据加载到kendo mvc ui网格之前显示加载图像？

我正在使用asp.net mvc 3.我试图使用kendo mvc ui网格显示记录列表。我已经设置了可编辑模式来弹出，所以处理可以在服务器上完成。我想显示加载图像数据被加载到页面中，这意味着前栅格，提神等我已经使用了网格状如何在数据加载到kendo mvc ui网格之前显示加载图像？

@(Html.Kendo().Grid(Model) 
    .Name("GrdXXX") 
    .HtmlAttributes(new { style="width:1000px;" }) 
    .Columns(columns => 
    { 
     columns.Bound(p => p.xxx).Width(50); 
     columns.Bound(p => p.yyy).Width(50); 
     columns.Bound(p => p.zzz).Width(80); 
     columns.Bound(p => p.State).Width(50); 
     columns.Bound(p => p.Phone).Width(70); 
     columns.Command(command => { command.Edit().Text("Edit Details"); command.Destroy().HtmlAttributes(new { onclick = "return DeleteConfirm();" }); }).Width(120); 
    }) 
    .ToolBar(toolbar => toolbar.Create().Text("Add New Zip Code")) 
    .Editable(editable => editable.Mode(GridEditMode.PopUp).Window(m => m.Title("Edit Zipcode").Draggable().Resizable())) 
      .Pageable() 
      .Sortable() 
      .Scrollable() 
    .DataSource(dataSource => dataSource 
     .Server() 
     .Model(model => model.Id(p => p.RecNo)) 
       .Update("Update", "ghj") 
       .Create("Create", "ghj") 
       .Destroy("Delete", "ghj") 
    ) 
)

我一直在使用jQuery的AJAX调用尝试，但它不为我工作。所以请指导我。

来源

2012-09-28 Karthik Bammidi

如果配置了ajax绑定，网格会自动显示加载图像。您的网格配置为依赖于常规HTTP GET请求的服务器绑定（无Ajax）。一旦浏览器开始发出HTTP GET请求，加载图像就会立即被删除。

来源

2012-09-28 07:06:22

我需要显示弹出窗口来编辑记录或添加新记录。所以我应该使用server（）方法。是否有任何方法可以在分页，加载等时显式加载效果。 –

不。我想我在回复中说过。 –

这就是我通过扩展jQuery明确地向Kendo网格添加加载效果的方法。它使用原生的Kendo造型。

$.extend($.fn, { 
     busy: function (c) { 
      b = $(this); 
      var d = b.find(".k-loading-mask"); 
      c ? d.length || (d = $("<div class='k-loading-mask'><span class='k-loading-text'>Loading...</span><div class='k-loading-image'/><div class='k-loading-color'/></div>").width(b.outerWidth()).height(b.outerHeight()).prependTo(b)) : d && d.remove() 
     }   
    });

，然后用它作为

$("#grid").busy(true); // change to false to hide loading effect

来源

2012-12-12 16:50:34

更好的解决方案所推荐的Telerik的：

// show loading indicator 
kendo.ui.progress($element, true); 

// hide loading indicator 
kendo.ui.progress($element, false); 

// $element is a jQuery object. The element must have a position:relative style applied

参考。 http://www.telerik.com/forums/how-to-manually-show-and-hide-loading-or-spinning-image#Y_apWF417kKpicdUz0NUHg

来源

2015-03-18 18:36:47 user1477388

如何在数据加载到kendo mvc ui网格之前显示加载图像？

回答

相关问题