如何正确拖动jqgrid编辑表单? [英] How can I drag jqgrid edit form properly?
问题描述
当我拖动一个编辑表单时，该表单的位置无效.
它始终从位置(0,0)开始到窗口.
它的位置与鼠标光标的位置无关.
When I drag a edit form, the position of the form is not valid.
Always it starts from position (0,0) to the window.
Its position is not relative to mouse cursor position.
我该如何解决?
这些是我的代码.
<table id="jqGrid"></table>
<div id="jqGridPager"></div>
<table id="jqGrid"></table>
<div id="jqGridPager"></div>
$("#jqGrid").jqGrid({
url: url,
mtype: "GET",
postData: data,
datatype: "jsonp",
colModel: [
{ label: 'd_id', name: 'd_id', width: 15, key: true, hidden: true},
{ label: 'driver', name: 'd_name', width: 30, align:"center", editable: true, editoptions: {size: 40} },
{ label: 'phone', name: 'd_phone', width: 30, align:"center", editable: true, editoptions: {size: 40} },
{ label: '', name: '' }
],
viewrecords: true,
autowidth: true,
height: '100%',
rownumbers: true,
rownumWidth: 25,
rowNum: 20,
editurl: g_base_url + 'driver/edit',
pager: "#jqGridPager",
loadError : function(xhr,st,err) {
},
loadComplete: function () {
},
onCellSelect: function(rowid, iCol, cellcontent, e) {
}
});
我的jqgrid版本是4.8，jquery版本是jquery-1.11.2，jquery-ui版本是1.11.4.
and my jqgrid version is 4.8, jquery version is jquery-1.11.2 and jquery-ui version is 1.11.4.
请访问jqgrid演示，然后单击编辑按钮(页面栏中的"+"符号)并拖动编辑表单serveral times.您会发现其位置始终从pos (0,0)开始.
please visit jqgrid demo and click edit button ("+" symbol in the page bar) and drag edit form serveral times. You can find its position always starts at pos (0,0).
演示链接为 http://www.guriddo.net/demo /guriddojs/edit_add_delete/edit_template/index.html
推荐答案
您描述的问题似乎是Guriddo jqGrid JS 4.8.x中的错误.我尝试了其他演示，并且那里的许多演示都存在相同的问题.因此，我建议您至少在购买 Guriddo jqGrid JS的许可证.
The problem which you describes seems be a bug in Guriddo jqGrid JS 4.8.x. I tried other demos and many from there have the same problem. So I would recommend you to post bug report to Guriddo forum at least if you purchased the licence for Guriddo jqGrid JS.
我以免费jqGrid的名称开发了jqGrid的 free 分支(请参见自述文件和 Wiki ).您可以直接从 CDN .如果您在jQuery UI模式对话框中使用网格，则应该使用发布 后发布免费jqGrid 4.8的最新代码.在答案中报告了该问题，我在免费jqGrid中添加了新选项onTop选项.
I develop free fork of jqGrid under the name free jqGrid (see the readme and the wiki). You can try it directly from CDN. If you uses grid inside of jQuery UI modal dialog then you should use the latest code posted after publishing free jqGrid 4.8. The problem was reported in the answer and I included new option onTop option in free jqGrid.
$.jgrid.jqModal = $.jgrid.jqModal || {};
$.extend(true, $.jgrid.jqModal, {toTop: true});
例如，您可以使用URL http://rawgit.com/free-jqgrid/jqGrid/master/css/ui.jqgrid.css和http://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js(在免费jqGrid中，诸如http://cdn.jsdelivr.net/free-jqgrid/4.8.0/js/i18n/grid.locale-en.js或http://rawgit.com/free-jqgrid/jqGrid/master/js/i18n/grid.locale-en.js之类的区域是可选的).
So you can use for example the URLs http://rawgit.com/free-jqgrid/jqGrid/master/css/ui.jqgrid.css, and http://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js (the locales like http://cdn.jsdelivr.net/free-jqgrid/4.8.0/js/i18n/grid.locale-en.js or http://rawgit.com/free-jqgrid/jqGrid/master/js/i18n/grid.locale-en.js are optional in free jqGrid).
稍后，我将尝试修改jqGrid使用的对话框的代码，以便检测到onTop: true的情况，并在需要时自动设置该选项.由于某些原因，我不想将其设置为默认值.我分析了jqGrid 4.7的代码并进行了许多更改.所有对话框(例如编辑"表单)保留在jqGrid的内存中的一种问题方式.如果关闭对话框，它将被隐藏.对话框中使用的事件处理程序，例如onClick处理程序引用网格的DOM元素和其他对象.还有其他一些缺点.因此，我这样做的目的是，在免费jqGrid中关闭对话框时，表单将完全变形.默认设置toTop: false使网格的所有元素(包括所有对话框)创建为在网格上构建的gbox div的子级.因此，只需删除gbox，就可以从jqGrid创建的 all 页面中删除所有元素.问题只是，如果一个对话框的另一个模态对话框内有网格，则应该像对话框本身一样将叠加层移动到页面顶部(为<body>的子级).我希望以后能找到理想的解决方案.直到您可以像上面的代码中一样，只为编辑表单或全局设置toTop: true选项.
I will try later to modify the code of dialogs used by jqGrid so that the situation where onTop: true will be detected and the option will be set automatically if required. I don't want to make it default because of some reasons. I analyzed the code of jqGrid 4.7 and make many changes. One problem way that all dialogs like Edit form stay in memory in jqGrid. If one close the dialog it will be just hidden. The event handler used in the dialogs, like onClick handler references DOM element of grid and other objects. There are some other disadvantages. So I make so that on closing of dialog in free jqGrid the form will be completely distorted. The default settings toTop: false makes all elements of the grid inclusive all dialogs be created as children of gbox div constructed over the grid. So one can remove from the page all elements created by jqGrid just by removing gbox. The problem is only that the overlay should be probably moved on top of the page (be children of <body>) like the dialog itself if one have the grid inside of another modal dialog. I hope I will find the perfect solution later. Till the time you can just set toTop: true option either for edit form or globally like in the code above.
这篇关于如何正确拖动jqgrid编辑表单?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
