问题描述
全部
我正在尝试在按下工具栏按钮[首页]时实现自定义警告消息，例如请选择行".我不想使用警报！
I'm trying to implement custom warning message like 'Please Select row' when toolbar button[top pager] is pressed. I don't want to use alert!!
我遵循了Oleg的示例之一(JqGrid大师对我来说至少！！)即Stackoverflow参考- jqGrid警告对话框.Oleg演示参考- http://www.ok-soft-gmbh.com/jqGrid/Warning.htm
I followed one of the examples from Oleg(JqGrid guru atleast to me!!)i.e.Stackoverflow reference - jqGrid warning dialog.Oleg demo reference - http://www.ok-soft-gmbh.com/jqGrid/Warning.htm
如果我使用的版本与Oleg演示版本相同，则一切正常.但是，如果我更改了jqGrid版本4.8.0，则相同的演示不起作用:(
All works well if i use the version same as in Oleg demo. BUT if i change the jqGrid version 4.8.0, the same demo not working :(
我用过-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.8.0/js/jquery.jqgrid.src.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.8.0/css/ui.jqgrid.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.8.0/js/i18n/grid.locale-en.js"></script>
代替
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.0/js/jquery.jqGrid.src.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.0/css/ui.jqgrid.css" />
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.0/js/i18n/grid.locale-en.js"></script>
是否知道模态用法在以后的版本中是否已更改?
Any idea whether modal usage changed in later version ?
最好的问候，桑达尔
推荐答案
首先，我建议您使用最新版本的免费jqGrid.是4.9.2.您可以从GitHub下载它，也可以从 CDN 直接(请参见此处).相应的网址将是
First of all I would recommend you to use the latest version of free jqGrid. It's 4.9.2. You can download it from GitHub or use from CDN directly (see here). The corresponding URLs will be
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/css/ui.jqgrid.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/js/jquery.jqgrid.min.js"></script>
以及可选的语言文件
<script src="https://cdn.jsdelivr.net/free-jqgrid/4.9.2/js/i18n/grid.locale-de.js"></script>
不需要包含英语语言环境文件grid.locale-en.js，因为它已包含在免费jqGrid(jquery.jqgrid.min.js或jquery.jqgrid.src.js)的主要代码中.
Including of English locale file grid.locale-en.js is not required, because it's included now in the main code of free jqGrid (jquery.jqgrid.min.js or jquery.jqgrid.src.js).
在我解释旧演示中的问题之前，我建议您使用简化的方法$.jgrid.info_dialog创建小对话框.相应的代码可能是
Before I explain the problems in the old demo I would recommend you to use simplified method $.jgrid.info_dialog to create small dialog. The corresponding code could be
$grid.jqGrid("navButtonAdd", {
caption: "Click me too!",
onClickButton: function () {
$.jgrid.info_dialog.call(this,
"Warning", // dialog title
"Please, select row!", // text inside of dialog
"Close", // text in the button
{ left: 100, top: 100 } // position relative to grid
);
}
});
显示的对话框如下所示
如果要使用语言环境文件中的文本元素，则可以将代码修改为以下内容
If you want use text elements from locale file then the code could be modified to the following
$grid.jqGrid("navButtonAdd", {
caption: "Click me too!",
onClickButton: function () {
var $self = $(this),
alertText = $self.jqGrid("getGridRes", "nav.alerttext"),
alertTitle = $self.jqGrid("getGridRes", "nav.alertcap"),
bClose = $self.jqGrid("getGridRes", "edit.bClose");
$.jgrid.info_dialog.call(this,
alertTitle, // dialog title
alertText, // text inside of dialog
bClose, // text in the button
{ left: 100, top: 100 } // position relative to grid
);
}
});
如果您要显示完全相同的警报对话框，并且在未选择任何行的情况下显示免费的jqGrid，则代码可能会特别简单
If you want to display exactly the same alert dialog which displays free jqGrid if no row is selected then the code could be especially simple
$grid.jqGrid("navButtonAdd", {
caption: "Click me!",
onClickButton: function () {
this.modalAlert();
}
});
如果您无法自定义文本，但是用法非常简单.
In the case you can't customize the texts, but the usage is really simple.
如果要像在旧演示中一样使用createModal和viewModal，则应了解以下内容.免费的jqGrid会有很多更改.代码中的主要兼容性问题:应该通过将this设置为网格的DOM来调用$.jgrid.createModal.因此，必须将旧演示中的$.jgrid.createModal(...)修改为$.jgrid.createModal.call(this,...).旧演示中的下一个问题非常简单.条件$("#"+alertIDs.themodal).html() === null在当前版本的jQuery中是错误的，最好使用$("#"+alertIDs.themodal).length === 0代替.这是旧演示中的下一个主要问题.完整的代码例如可以是以下
If you want to use createModal and viewModal like in old demo you should understand the following. There are of cause many changes in free jqGrid. The main compatibility problem in the code: one should call $.jgrid.createModal by setting this to the DOM of the grid. So one have to modify $.jgrid.createModal(...) in the old demo to $.jgrid.createModal.call(this,...). The next problem in the old demo very simple. The condition $("#"+alertIDs.themodal).html() === null is wrong in the current versions of jQuery and one should better use $("#"+alertIDs.themodal).length === 0 instead. It's the next main problem in the old demo. The full code could be for example the following
$grid.jqGrid("navButtonAdd", {
caption: "Click me!",
onClickButton: function () {
var $self = $(this),
p = $self.jqGrid("getGridParam"),
gridId = p.id,
alertIDs = {
themodal: "myalertmod_" + gridId,
modalhead: "myalerthd_" + gridId,
modalcontent: "myalertcnt_" + gridId
},
alertSelector = "#" + $.jgrid.jqID(alertIDs.themodal),
alertText = $self.jqGrid("getGridRes", "nav.alerttext"),
alertTitle = $self.jqGrid("getGridRes", "nav.alertcap");
if ($(alertSelector).length === 0) {
$.jgrid.createModal.call(this,
alertIDs,
"<div>" + alertText + "</div>",
{
gbox: p.gBox,
jqModal: true,
drag: true,
resize: true,
caption: alertTitle,
top: 100,
left: 100,
width: 200,
height: "auto",
closeOnEscape: true,
zIndex: null
},
"", "", true);
}
$.jgrid.viewModal(
alertSelector,
{
gbox: p.gBox,
toTop: true
});
}
});
这篇关于免费的jqgrid-jqGrid警告对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！