jqGrid可以支持使用本地数据拖放行吗?

Tim*_*Tim 2 jqgrid

我正在学习jqGrid,希望最终将它连接到Redis数据库.作为第一步,我正在使用本地数据.这是我必须使用可排序的行(在网格中拖放行).网格显示并且看起来很好,列甚至可以排序,但我不能选择一行并移动它 - 我错过了什么?是因为数据是本地的吗?

加载css和js文件没有问题.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>

<link rel="stylesheet" type="text/css" media="screen" href="themes/redmond/jquery-ui-1.8.23.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.8.23.custom.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
  jQuery("#mytable").jqGrid({
      datatype:"clientSide",
      data:[ {"number": 1, "segment":"frontmatter", "name": "chap0"},
             {"number": 2, "segment":"mainmatter",  "name": "chap1"},
             {"number": 3, "segment":"backmatter",  "name": "chap2"},
           ],
      colNames:['Chapter Name', 'Chapter Number', 'Document Segment'],
      colModel:[
              {name:'name'},
              {name:'number', sorttype:'number'},
              {name:'segment'},
              ],
      autowidth:true,
      height:'200',
      sortname: 'number',
      viewrecords: true,
      caption: 'My first grid',
      altRows:true,
  });
});
jQuery("#sortrows").jqGrid('sortableRows');
</script>

</head>
<body>

<table id="mytable"></table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

Ole*_*leg 5

是的,jqGrid支持带有本地数据的sortableRows.该演示只是答案中演示的副本,使用jqGrid 4.4.1并且它可以工作.

您发布的代码有两个小但重要的错误:

  • 您使用jQuery("#sortrows").jqGrid('sortableRows');,但是您使用另一个创建了网格id:jQuery("#mytable").所以你必须"#sortrows"改为"#mytable"
  • 你要招行jQuery("#mytable").jqGrid('sortableRows'); 内部$(document).ready(function(){});块.您sortableRows 创建网格之前进行当前代码调用,因此无法正常工作.