demo3.html 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  5. <link rel="stylesheet" type="text/css" href="../css/gm.css">
  6. <script type="text/javascript" src="../js/gm.js"></script>
  7. <title>GridManager:多表I18N</title>
  8. <link rel="stylesheet" type="text/css" href="./css/common.css">
  9. </head>
  10. <body>
  11. <script type="text/javascript">
  12. const createTable = (title, arg) => {
  13. const h3 = document.createElement('h3');
  14. h3.innerText = title;
  15. document.body.appendChild(h3);
  16. const div = document.createElement('div');
  17. const table = document.createElement('table');
  18. div.appendChild(table);
  19. document.body.appendChild(div);
  20. new GridManager(table, arg);
  21. };
  22. createTable('简体中文: { i18n: "zh-cn" }', {
  23. height: '300px',
  24. gridManagerName: 'test1',
  25. supportAjaxPage:true,
  26. ajaxData: 'https://www.lovejavascript.com/learnLinkManager/getLearnLinkList',
  27. ajaxType: 'POST',
  28. query: {tableName: 'test1', ccname: 'baukh'},
  29. pageSize:10,
  30. columnData: [
  31. {
  32. key: 'name',
  33. remind: '网站标题',
  34. width: '100px',
  35. text: '标题',
  36. sorting: 'up'
  37. },{
  38. key: 'info',
  39. remind: '网站介绍',
  40. text: '介绍',
  41. sorting: ''
  42. },{
  43. key: 'url',
  44. remind: '网站地址',
  45. text: '地址'
  46. }
  47. ]
  48. });
  49. createTable('English: { i18n: "en-us" }', {
  50. height: '400px',
  51. gridManagerName: 'test2',
  52. i18n: 'en-us',
  53. ajaxData: 'https://www.lovejavascript.com/learnLinkManager/getLearnLinkList',
  54. ajaxType: 'POST',
  55. query: {tableName: 'test2', 'love': 'kouzi'},
  56. pageSize:20,
  57. supportAjaxPage:true,
  58. columnData: [
  59. {
  60. key: 'name',
  61. remind: 'the name',
  62. width: '100px',
  63. text: 'name',
  64. sorting: 'DESC'
  65. },{
  66. key: 'info',
  67. remind: 'the info',
  68. text: 'info',
  69. sorting: ''
  70. },{
  71. key: 'url',
  72. remind: 'the url',
  73. text: 'url'
  74. }
  75. ]
  76. });
  77. createTable('繁體中文: { i18n: "zh-tw" }', {
  78. height: '300px',
  79. gridManagerName: 'test3',
  80. i18n: 'zh-tw',
  81. ajaxData: 'https://www.lovejavascript.com/learnLinkManager/getLearnLinkList',
  82. ajaxType: 'POST',
  83. query: {tableName: 'test3', baby: 'kouzi'},
  84. pageSize:30,
  85. supportAjaxPage:true,
  86. columnData: [
  87. {
  88. key: 'name',
  89. remind: '網站名稱',
  90. width: '100px',
  91. text: '名稱',
  92. sorting: 'DESC'
  93. },{
  94. key: 'info',
  95. remind: '網站介紹',
  96. text: '介紹',
  97. sorting: ''
  98. },{
  99. key: 'url',
  100. remind: '網站地址',
  101. text: '地址'
  102. }
  103. ]
  104. });
  105. </script>
  106. </body>
  107. </html>