treefrozengrid.htm 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title></title>
  5. <link href="../../../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
  6. <script src="../../../lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
  7. <script src="../../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  8. <script src="../../../lib/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script>
  9. <script src="../TreeDeptData.js" type="text/javascript"></script>
  10. <script type="text/javascript">
  11. var treegrid;
  12. $(function ()
  13. {
  14. treegrid = $("#maingrid").ligerGrid({
  15. columns: [
  16. { display: '部门名', name: 'name', width: 250, align: 'left', frozen: true },
  17. { display: '部门标示', name: 'id', width: 250, type: 'int', align: 'left' },
  18. { display: '部门描述', name: 'remark', width: 250, align: 'left' }
  19. ], width: '100%', pageSizeOptions: [5, 10, 15, 20], height: '97%',
  20. checkbox:true,title:'头部',
  21. data: TreeDeptData, alternatingRow: false, tree: { columnName: 'name' }
  22. }
  23. );
  24. });
  25. function getParent()
  26. {
  27. alert(document.getElementById("maingrid|1|1004").innerHTML);
  28. var row = treegrid.getParent(treegrid.getSelectedRow());
  29. alert(JSON.stringify(row));
  30. }
  31. function getSelected()
  32. {
  33. var row = treegrid.getSelectedRow();
  34. if (!row) { alert('请选择行'); return; }
  35. alert(JSON.stringify(row));
  36. }
  37. function getData()
  38. {
  39. var data = treegrid.getData();
  40. alert(JSON.stringify(data));
  41. }
  42. function hasChildren()
  43. {
  44. var row = treegrid.getSelectedRowObj();
  45. alert(treegrid.hasChildren(row));
  46. }
  47. function isLeaf()
  48. {
  49. var row = treegrid.getSelectedRowObj();
  50. alert(treegrid.isLeaf(row));
  51. }
  52. </script>
  53. </head>
  54. <body style="padding:4px">
  55. <div>
  56. <a class="l-button" style="width:120px;float:left; margin-left:10px;" onclick="getParent()">获取父节点</a>
  57. <a class="l-button" style="width:120px;float:left; margin-left:10px;" onclick="hasChildren()">是否有子节点</a>
  58. <a class="l-button" style="width:120px;float:left; margin-left:10px;" onclick="isLeaf()">是否叶节点节点</a>
  59. <a class="l-button" style="width:120px;float:left; margin-left:10px;" onclick="getSelected()">获取选中的值(选择行)</a>
  60. <a class="l-button" style="width:120px;float:left; margin-left:10px;" onclick="getData()">获取当前的值</a>
  61. <div class="l-clear"></div>
  62. </div>
  63. <div id="maingrid"></div>
  64. <div>
  65. </div>
  66. </body>
  67. </html>