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>

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

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

您使用jQuery("#sortrows").jqGrid('sortableRows');，但您使用另一个id创建了网格：jQuery("#mytable") 。所以你必须把"#sortrows"改成"#mytable"
您必须将线路移动到$(document).ready(function(){});块内jQuery("#mytable").jqGrid('sortableRows');。您当前的代码调用sortableRows创建网格之前，因此它将不起作用。

相关内容

最新更新

热门标签：