- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我已经使用用于删除的 Jquery 模式对话框创建了 JQGrid。 Jqgrid 具有内联编辑功能,如果我将其留空并且按下提交,它将弹出消息请输入名字,但问题是内置弹出消息和我的 jquery 模式对话框看起来太不同了,需要一个字段。
内置 JQGrid 模态对话框:
JQuery 模态对话框
代码:
function createGrid() {
jQuery("#list").jqGrid({
url: '@Url.Action("JQGridGetGridData", "TabMaster")',
datatype: 'json',
mtype: 'GET',
colNames: ['col ID', 'First Name', 'Last Name', ''],
colModel: [{ name: 'colID', index: 'colID', width: 100, align: 'left', searchoptions: { sopt: ['eq', 'ne', 'cn']} },
{ name: 'FirstName', index: 'FirstName', width: 150, align: 'left', editable: true, editrules: { required: true} },
{ name: 'LastName', index: 'LastName', width: 150, align: 'left', editable: true, editrules: { required: true} },
{ name: 'act', index: 'act', width: 60, sortable: false}],
pager: jQuery('#pager'),
hidegrid: false,
rowNum: 100,
rowList: [10, 50, 100, 150],
sortname: 'colID',
sortorder: "asc",
viewrecords: true,
multiselect: false,
width: 500,
height: "250px",
imgpath: '@Url.Content("~/Scripts/themes/steel/images")',
caption: 'Tab Master Information',
editurl: '@Url.Action("JQGridEdit", "TabMaster")',
gridComplete: function () {
var ids = jQuery("#list").getDataIDs();
for (var i = 0; i < ids.length; i++) {
var id = ids[i];
be = "<a href='#'><div title='Edit' id='action_edit_" + id + "' class='actionEdit' onclick='inlineEdit(" + id + ");'></div></a>";
de = "<a href='#'><div title='Delete' id='action_delete_" + id + "' class='actionDelete' onclick='inlineDelete(" + id + ");'></div></a>";
se = "<a href='#'><div title='Save' style='display:none' id='action_save_" + id + "' class='actionSave' onclick='inlineSave(" + id + ");'></div></a>";
ce = "<a href='#'><div title='Cancel' style='display:none' id='action_cancel_" + id + "' class='actionCancel' onclick='inlineCancel(" + id + ");'></div></a>";
jQuery("#list").setRowData(ids[i], { act: be + de + se + ce })
}
}
}).navGrid('#pager', { edit: false, add: false, del: false, search: false, refresh: false });
}
如何将 Jquery 模态对话框应用于 JQGrid 内置对话框皮肤?
谢谢,伊姆达胡森
最佳答案
jqGrid 是 jQuery 插件,而不是 jQuery UI 小部件。所以它不使用 jQuery UI 对话框。相反,它使用 $.jgrid.createModal , $.jgrid.viewModal和 $.jgrid.hideModal方法。在某些情况下简化版本 $.jgrid.info_dialog被使用。许多人(包括我)希望下一个版本中的 jqGrid 将在内部使用更多 jQuery UI 控件,并且可能会是一个 jQuery UI 小部件,但现在如果您想以 jqGrid 样式创建对话框,您应该使用我介绍的方法。上面列出了。
作为我建议的函数使用示例 the following example它创建与 jqGrid 相同的对话框 delGridRow方法。我在演示中包含了“删除”导航按钮来显示,如果您首先使用创建对话框的“删除所选行”按钮,然后使用“删除”导航按钮,jqGrid 将不会创建新对话框。相反,将使用我们的自定义对话框。
对应的代码如下:
var grid = $("#list"),
gID = grid[0].id, //grid[0].p.id,
IDs = {
themodal:'delmod'+gID,
modalhead:'delhd'+gID,
modalcontent:'delcnt'+gID,
scrollelm:'DelTbl_'+gID
},
hideDialog = function() {
$.jgrid.hideModal("#"+IDs.themodal,{gb:"#gbox_"+gID,jqm:true, onClose: null});
},
rowId,
createDeleteDialog = function() {
var dlgContent =
"<div id='"+IDs.scrollelm+"' class='formdata' style='width: 100%; overflow: auto; position: relative; height: auto;'>"+
"<table class='DelTable'>"+
"<tbody>"+
"<tr id='DelError' style='display: none'>"+
"<td class='ui-state-error'></td>"+
"</tr>"+
"<tr id='DelData' style='display: none'>"+
"<td>"+rowId+"</td>"+ // it has not so much sense
"</tr>"+
"<tr>"+
"<td class='delmsg' style='white-space: pre;'>"+$.jgrid.del.msg+"</td>"+
"</tr>"+
"<tr>"+
"<td> </td>"+
"</tr>"+
"</tbody>"+
"</table>"+
"</div>"+
"<table cellspacing='0' cellpadding='0' border='0' class='EditTable' id='"+IDs.scrollelm+"_2'>"+
"<tbody>"+
"<tr>"+
"<td>"+
"<hr class='ui-widget-content' style='margin: 1px' />"+
"</td>"+
"</tr>"+
"<tr>"+
"<td class='DelButton EditButton'>"+
"<a href='javascript:void(0)' id='dData' class='fm-button ui-state-default ui-corner-all'>Delete</a>"+
" <a href='javascript:void(0)' id='eData' class='fm-button ui-state-default ui-corner-all'>Cancel</a>"+
"</td>"+
"</tr>"+
"</tbody>"+
"</table>";
if ($('#'+IDs.themodal).length===0) {
// dialog not yet exist. we need create it.
$.jgrid.createModal(
IDs,
dlgContent,
{
gbox: "#gbox_"+gID,
caption: $.jgrid.del.caption,
jqModal: true,
left: 12,
top: 44,
overlay: 10,
width: 240,
height: 'auto',
zIndex: 950,
drag: true,
resize: true,
closeOnEscape: true,
onClose: null
},
"#gview_"+gID,
$("#gview_"+gID)[0]);
$("#dData","#"+IDs.scrollelm+"_2").click(function(){
// "Delete" button is clicked
var rowId = grid.jqGrid('getGridParam', 'selrow');
grid.jqGrid('delRowData',rowId);
//$.jgrid.hideModal("#"+IDs.themodal,{gb:"#gbox_"+gID,jqm:true, onClose: null});
hideDialog();
});
$("#eData", "#"+IDs.scrollelm+"_2").click(function(){
// "Cancel" button is clicked
//$.jgrid.hideModal("#"+IDs.themodal,{gb:"#gbox_"+gID,jqm:true, onClose: null});
hideDialog();
//return false;
});
}
$.jgrid.viewModal("#"+IDs.themodal,{gbox:"#gbox_"+gID,jqm:true, overlay: 10, modal:false});
};
grid.jqGrid({/*jqGrid options*/});
$("#delgridrow").click(function() {
rowId = grid.jqGrid('getGridParam', 'selrow');
if (rowId === null) {
$.jgrid.viewModal("#alertmod",{gbox:"#gbox_"+grid[0].p.id,jqm:true});
$("#jqg_alrt").focus();
} else {
createDeleteDialog();
}
return false;
});
关于jquery - 为什么 JQuery 模态对话框和 JQGrid 模态对话框看起来不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6693694/
#include #include #include using namespace std::chrono; int main(int arc, char* argv[]) { con
我是 opencv 的新手。当我将 sRGB png 提供给它时,我发现以下代码交换了红色和蓝色 channel 。我应该责怪哪个函数,imread 还是 fromarray? 最佳答案 是的,O
我正在使用以下代码,它缩小了每一行,并且由于某种原因整个用户界面也丢失了。我该如何解决?
它是关于以下设置的:Linux 机器、bash、adb、带有 Busybox 的嵌入式 Linux 目标系统。对于目标系统,以下适用: adb shell echo $SHELL /bin/sh ad
当我在 Android Studio 上创建一个空 fragment 时,它会生成以下代码: /** * A simple {@link Fragment} subclass. * Activit
我正在尝试从 Meteor 应用程序的服务器端发布用户的 Facebook 提要: result = Meteor.http.call 'POST', "https://graph.faceb
目前我有两个不同的查询,它们返回完全相同的结果,但是,更改从中过滤结果的参数会使它们以非常不同的方式运行。 搜索 cartography 时的结果 查询 #1: 22 行/~860 毫秒; SELEC
我已经创建了结构: typedef struct { short s; int i; struct Ss { short s; }; } S;
我想在 Java 中打印反斜杠 t。但每当我尝试时,它实际上都将它作为\t 运算符。双反斜杠不起作用。我该怎么做。 最佳答案 例如通过添加另一个反斜杠来转义反斜杠 System.out.println
我想弄清楚为什么 UIActivityViewController 发送一个稍微转换过的字符串来分享给邮件和微信。 这是我的代码: let activityViewController = UIAct
创建标准 SQLite 游标后,我将使用以下方法遍历条目: while (cursor.moveToNext()) { } 所有行都被正确处理。我读过的所有文档都表明您需要发出 moveToFirst
我正在尝试创建一个基本论坛,但在 SQL 中仅打印一行时遇到问题。这是我的 PHP: {$title}"; } } else { print "failed to reach post
我的新 div 元素 ( ) 似乎隐藏在图像后面。我键入的任何内容都显示在图像后面。我想在背景图片之后继续工作。 这是我的代码: DISPLAY
UPD。一行代码解决了问题:.lean() axplanation here 我在 Model.find(...blablabla : [ {"_id":"578763de6e8e0542195ef4
我在 Ubuntu 16.04 中安装了 Tomcat 8.0.45。我使用 let's encrypt 生成的证书启用了 HTTPS 连接器。它就像一个魅力。但是今天Tomcat无法启动HTTPS连
今天,我在一台全新安装了 Windows 7 Ultimate 64 位的新笔记本电脑上安装了 Visual Studio 2010 Professional。我非常习惯于 Visual Studio
根据 Oracle,我应该能够将 .intValue() 和 .compareTo() 之类的方法应用于 double ,但是当我编写 dbl.toString( ) 例如,在 NetBeans 中,
正在为应用程序开发一些拖放功能,虽然可以使用“重影图像”来完成很多事情,将毒品从一个地方转移到另一个地方,但它们看起来总是有点“褪色” - 因此得名鬼影。是否有可能使这些具有与原始颜色相同的深度?谢谢
我是这方面的新手,很抱歉犯了一些愚蠢的错误。快乐学习。每当我使用 URL : localhost:3000/posts/whatever 时,我都会收到无法获取错误。在你问之前,是的,那是在我将内容放
背景 这自然是合法的: let closure: (Int, Int) -> () = { print($0 + $1) } closure(1, 2) // 3 鉴于,自进化提案实现以来 SE-01
我是一名优秀的程序员,十分优秀!