如何在不可拖动的行之间放置jqgrid行 [英] how to drop jqgrid row between not draggable rows
问题描述
我有一个jgGrid，
I have a jgGrid where,
- 我可以上下拖放行
- 我还做了必要的安排，以使用户无法拖动"test4"& "test5"行
问题:一切正常，但是当我尝试在"test4"和""test5"行，我无法执行该操作?
Question : Everything's works perfect, but when I try to drop row between "test4" & "test5" row, I m not able to do that?
看起来，当有2条不可可拖动的行时，我们不能在它们之间插入一行?
Looks like, when there is 2 not draggable rows, we can't put a row in between?
有什么办法，我们可以放弃吗???谢谢
Is there any way, we can drop??? Thanks
这是代码
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/themes/redmond/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.1/css/ui.jqgrid.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.1/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.1/js/jquery.jqGrid.src.js"></script>
<style type="text/css">
.unsortable {}
</style>
<script type="text/javascript">
$(document).ready(function () {
'use strict';
var mydata = [
{id: "1", name: "test1"},
{id: "2", name: "test2"},
{id: "3", name: "test3"},
{id: "4", name: "test4"},
{id: "5", name: "test5"},
{id: "6", name: "test6"},
{id: "7", name: "test7"}
];
$("#list").jqGrid({
datatype: 'local',
data: mydata,
colNames: [/*'Id', */'Client'],
colModel: [
{name: 'name', index: 'name', width: 200}
],
loadComplete: function (data) {
jQuery("#4",jQuery("#list")[0]).addClass('unsortable');
jQuery("#5",jQuery("#list")[0]).addClass('unsortable');
}
}).jqGrid('sortableRows', { items: '.jqgrow:not(.unsortable)'});
});
</script>
</head>
<body>
<table id="list"><tr><td></td></tr></table>
</body>
</html>
推荐答案
似乎您使用了多年前在中发布的我的旧代码.答案. jqGrid和jQuery UI现在具有许多新功能.
It seems that you use my old code posted many years ago in the answer. jqGrid and jQuery UI have now many new features.
我觉得你的问题很有趣.因此，我创建了 演示 ，它展示了一种可能的解决方案:
I find your question very interesting. Thus I created the demo, which demonstrates a possible solution:
解决方案的思想在于使用jQuery UI sortable的cancel选项而不是items(请参见 jQuery UI文档以获取更多详细信息).
The idea of the solution consists from using cancel option of jQuery UI sortable instead of items (see jQuery UI documentation for more details).
我在演示类ui-state-disabled中使用了类而不是unsortable，并且通过使用rowattr将类分配给了特定项目，这对于修改先前创建的行的loadComplete中.
I used in my demo ui-state-disabled class instead of unsortable and I assign the class to specific items by usage of rowattr, which is more effective as modifying classes of previously created rows in loadComplete.
var disabledIds = ["4", "5"];
$("#list").jqGrid({
...
rowattr: function (item) {
if ($.inArray(item.id, disabledIds) >= 0) {
return {"class": "ui-state-disabled"};
}
},
...
});
sortableRows的主调用看起来像
$("#list").jqGrid("sortableRows", { cancel: ".ui-state-disabled" });
我建议您另外使用jqGrid的最新版本4.4.1.我建议您使用免费jqGrid 4.9.2(请参见
I would recommend you additionally to use more recent version of jqGrid as 4.4.1. I would recommend you to use free jqGrid 4.9.2 (see the wiki).
这篇关于如何在不可拖动的行之间放置jqgrid行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
