editgridupdatecell.htm 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  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/json2.js" type="text/javascript"></script>
  8. <script src="../../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  9. <script src="../../../lib/ligerUI/js/plugins/ligerDialog.js" type="text/javascript"></script>
  10. <script src="../../../lib/ligerUI/js/plugins/ligerTextBox.js" type="text/javascript"></script>
  11. <script src="../../../lib/ligerUI/js/plugins/ligerCheckBox.js" type="text/javascript"></script>
  12. <script src="../../../lib/ligerUI/js/plugins/ligerComboBox.js" type="text/javascript"></script>
  13. <script src="../../../lib/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script>
  14. <script src="../../../lib/ligerUI/js/plugins/ligerDateEditor.js" type="text/javascript"></script>
  15. <script src="../../../lib/ligerUI/js/plugins/ligerSpinner.js" type="text/javascript"></script>
  16. <script src="../EmployeeData.js" type="text/javascript"></script>
  17. <script type="text/javascript">
  18. var data = [{
  19. UnitPrice: 10,
  20. Quantity: 2,
  21. Price: 20
  22. }];
  23. function formatCurrency(num)
  24. {
  25. if (!num) return "0.00";
  26. num = num.toString().replace(/\$|\,/g, '');
  27. if (isNaN(num))
  28. num = "0.00";
  29. sign = (num == (num = Math.abs(num)));
  30. num = Math.floor(num * 100 + 0.50000000001);
  31. cents = num % 100;
  32. num = Math.floor(num / 100).toString();
  33. if (cents < 10)
  34. cents = "0" + cents;
  35. for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
  36. num = num.substring(0, num.length - (4 * i + 3)) + ',' +
  37. num.substring(num.length - (4 * i + 3));
  38. return (((sign) ? '' : '-') + '' + num + '.' + cents);
  39. }
  40. var manager = null;
  41. $(function()
  42. {
  43. f_initGrid();
  44. });
  45. function f_initGrid()
  46. {
  47. window['g'] =
  48. manager = $("#maingrid").ligerGrid({
  49. columns: [
  50. { display: '单价', name: 'UnitPrice', width: 100, type: 'float', editor: { type: 'int' }, render: function(item)
  51. {
  52. return formatCurrency(item.UnitPrice);
  53. }
  54. },
  55. { display: '数量', name: 'Quantity', width: 100, type: 'int', editor: { type: 'int'} },
  56. { display: '金额', name: 'Price', width: 100, type: 'int', render: function(item)
  57. {
  58. return formatCurrency(item.Price) + "元";
  59. }
  60. }
  61. ],
  62. enabledEdit: true, usePager: false, isScroll: false, onAfterEdit: f_onAfterEdit,
  63. data: { Rows: data },
  64. width: '100%'
  65. });
  66. }
  67. function f_onAfterEdit(e)
  68. {
  69. manager.updateCell('Price', e.record.UnitPrice * e.record.Quantity, e.record);
  70. }
  71. function addNewRow()
  72. {
  73. manager.addRow({
  74. UnitPrice: 0,
  75. Quantity: 0,
  76. Price : 0
  77. });
  78. }
  79. function getSelected()
  80. {
  81. var manager = $("#maingrid").ligerGetGridManager();
  82. var row = manager.getSelectedRow();
  83. if (!row) { alert('请选择行'); return; }
  84. alert(JSON.stringify(row));
  85. }
  86. function getData()
  87. {
  88. var manager = $("#maingrid").ligerGetGridManager();
  89. var data = manager.getData();
  90. alert(JSON.stringify(data));
  91. }
  92. </script>
  93. </head>
  94. <body style="padding:10px">
  95. <a class="l-button" style="width:100px;float:left; margin-left:10px;" onclick="addNewRow()">添加行</a><br /><br />
  96. <div id="maingrid" style="margin-top:20px"></div> <br />
  97. <br />
  98. <a class="l-button" style="width:120px" onclick="getSelected()">获取选中的值(选择行)</a>
  99. <br />
  100. <a class="l-button" style="width:120px" onclick="getData()">获取当前的值</a>
  101. <div style="display:none;">
  102. <!-- g data total ttt -->
  103. </div>
  104. </body>
  105. </html>