comboBoxGrid.htm 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  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. <style type="text/css">
  7. </style>
  8. <script src="../../lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
  9. <script src="../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  10. <script src="../../lib/ligerUI/js/plugins/ligerResizable.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="../grid/CustomersData.js" type="text/javascript"></script>
  15. <script type="text/javascript">
  16. function getGridOptions(checkbox)
  17. {
  18. var options = {
  19. columns: [
  20. { display: '顾客', name: 'CustomerID', align: 'left', width: 100, minWidth: 60 },
  21. { display: '公司名', name: 'CompanyName', minWidth: 120 },
  22. { display: '联系名', name: 'ContactName', minWidth: 140 },
  23. { display: '电话', name: 'Phone' },
  24. { display: '城市', name: 'City' },
  25. { display: '国家', name: 'Country' }
  26. ], switchPageSizeApplyComboBox: false,
  27. data: $.extend({}, CustomersData),
  28. pageSize: 30,
  29. checkbox: checkbox
  30. };
  31. return options;
  32. }
  33. $(function ()
  34. {
  35. $("#txt1").ligerComboBox({
  36. width: 250,
  37. slide: false,
  38. selectBoxWidth: 500,
  39. selectBoxHeight: 240, valueField: 'CustomerID', textField: 'CustomerID'
  40. , grid: getGridOptions(true)
  41. });
  42. $("#txt2").ligerComboBox({
  43. width: 250,
  44. slide: false,
  45. selectBoxWidth: 500,
  46. selectBoxHeight: 240, valueField: 'CustomerID', textField: 'CustomerID'
  47. , grid: getGridOptions(false)
  48. });
  49. });
  50. </script>
  51. </head>
  52. <body style="padding: 10px">
  53. 带复选框:
  54. <br />
  55. <input type="text" id="txt1" />
  56. <br />
  57. 不带复选框:
  58. <br />
  59. <input type="text" id="txt2" />
  60. <br />
  61. <div style="display: none;">
  62. </div>
  63. </body>
  64. </html>