有人知道如何触发jqGrid的“正在加载”覆盖层吗？在网格加载时会显示。我知道我可以使用一个jquery插件，但我想保持我的应用程序外观和jqGrid中已经使用的一致。
我找到的最接近的内容是这个：
jqGrid display default "loading" message when updating a table / on custom update
- n8
10个回答
17
如果你正在寻找类似于
DisplayLoadingMessage() 的函数，那么 jqGrid 并没有这样的函数。你只能将 jqGrid 的 loadui 选项设置为enable（默认）、disable或block。我个人更喜欢block（参见http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options）。但我认为这不是你想要的。
如果你喜欢 jqGrid 中的 "Loading..." 消息，那么唯一能做的就是自己创建相同的消息。这里我会解释 jqGrid 显示此消息的方法：将创建两个隐藏的div。如果你的表格 id 是 list，则这些 div 将如下所示：
<div style="display: none" id="lui_list"
class="ui-widget-overlay jqgrid-overlay"></div>
<div style="display: none" id="load_list"
class="loading ui-state-default ui-state-active">Loading...</div>
文本“Loading...”或“Lädt...”（德语）来自$.jgrid.defaults.loadtext。div的ID将根据“lui_”或“load_”前缀和网格ID（“list”）构建。在发送ajax请求之前，jqGrid会使其中一个或两个div可见。如果loadui选项为enable，它将调用jQuery.show()函数显示第二个div（id=“load_list”）。然而，如果loadui选项为block，则使用.show()函数显示两个div（id=“lui_list”和id=“load_list”）。在ajax请求结束后，将对一个或两个div调用.hide() jQuery函数。没了。
您可以在ui.jqgrid.css或jquery-ui-1.8.custom.css中找到所有CSS类的定义。
现在您已经拥有足够的信息来重现jqGrid的“Loading…”消息，但如果我是您，我会再三考虑是否真的想要这样做，或者jQuery blockUI插件是否更适合您的目标。
- Oleg
2
感谢您详细的回复！哇，您提供的“选项”链接真的让我可以访问 jqGrid 的核心部分，可惜直到现在我才完全不知道。我发现 jqGrid 的文档有点反直觉和难以理解，但我正在逐渐适应它。这需要一定的学习曲线。我会尝试玩弄“load_list”div，看看能否使其正常工作。我可能最终会按照建议使用 jQuery BlockUI。但至少我现在感觉有了选择（无意双关语）。 - gurun8
我很快就发现了实现我的目标所需的操作：$("#load_list").show();
$("#load_list").css("z-index", 1000);和$("#load_list").hide();
$("#load_list").css("z-index", 101);我需要更改和恢复z-index以在自定义对话框框上显示div。只是想分享一下。 - gurun8
7
我使用
$('.loading').show();
$('.loading').hide();
不需要创建新的
元素就可以正常工作
- dr0zd
3
简单来说，就是展示它：
$("#myGrid").closest(".ui-jqgrid").find('.loading').show();
然后再次隐藏它
$("#myGrid").closest(".ui-jqgrid").find('.loading').hide();
- Justin Levene
2
1请注意，当您在一个旧帖子上发布回复时，特别是当该帖子已经有其他几个回复，尤其是其中一个被采纳的回复时，请解释为什么您的答案比所有现有的答案都更好。 - APC
谢谢！这个答案比其他答案更好，因为（1）它非常简短，（2）它处理了同一页上两个网格的情况。 - John Henckel
2
我只是在JQ网格的onSelectRow事件中添加了下面这行代码，它可以正常工作。
$('.loading').show();
- R Kumar
1
需要覆盖的样式为 [.ui-jqgrid .loading]。
- Joel E
1
这仅适用于网格中间的“正在加载...”，而不是在加载时阻止访问网格的窗口叠加。 - Jimbo
0
在我的问题中，我使用了
$('.jsgrid-load-panel').hide()
那么
$('.jsgrid-load-panel').show()
- andro apana
1
这是针对jsGrid而不是jqGrid的，它们非常不同。请考虑（重新）移除。 - Tony Tomov
0
正如@Oleg所提到的，jQuery Block UI在开发基于ajax的应用程序时具有许多优秀的功能。使用它，您可以阻止整个UI或称为元素块的特定元素。
对于jqGrid，您可以将网格放入一个div（sampleGrid）中，然后像这样阻止网格：
$.extend($.jgrid.defaults, {
ajaxGridOptions : {
beforeSend: function(xhr) {
$("#sampleGrid").block();
},
complete: function(xhr) {
$("#sampleGrid").unblock();
},
error: function(jqXHR, textStatus, errorThrown) {
$("#sampleGrid").unblock();
}
}
});
- Alireza Fattahi
0
它正在与$('div.loading').show()一起工作；即使对于其他组件，这也很有用
$('#editDiv').dialog({
modal : true,
width : 'auto',
height : 'auto',
buttons : {
Ok : function() {
//Call Action to read wo and
**$('div.loading').show();**
var status = call(...)
if(status){
$.ajax({
type : "POST",
url : "./test",
data : {
...
},
async : false,
success : function(data) {
retVal = true;
},
error : function(xhr, status) {
retVal = false;
}
});
}
if (retVal == true) {
retVal = true;
$(this).dialog('close');
}
**$('div.loading').hide();**
},
Cancel : function() {
retVal = false;
$(this).dialog('close');
}
}
});
- Anand
0
您可以调用 $("#load_").show() 和 .hide()，其中 为您的网格的 ID。
- Chris Kemp
0
如果您不想阻塞并且不使用内置的ajax调用来获取数据，您可以像下面这样扩展jqgrid函数：
隐藏加载元素，针对特定的网格进行定位，以防在同一页上有多个网格。
datatype="local"
$.jgrid.extend({
// Loading function
loading: function (show) {
if (show === undefined) {
show = true;
}
// All elements of the jQuery object
this.each(function () {
if (!this.grid) return;
// Find the main parent container at level 4
// and display the loading element
$(this).parents().eq(3).find(".loading").toggle(show);
});
return show;
}
});
然后简单调用
$("#myGrid").loading();
或者
$("#myGrid").loading(true);
显示所有网格的加载状态（当然，每个网格的ID都要更改）或
$("#myGrid").loading(false);
隐藏加载元素，针对特定的网格进行定位，以防在同一页上有多个网格。
- dpineda
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接