PageRenderTime 55ms CodeModel.GetById 16ms RepoModel.GetById 0ms app.codeStats 0ms

/Frontend/bower_components/kendo/apptemplates/grid-and-menu/index.html

https://gitlab.com/lmachillanda591/Startlance1.0
HTML | 219 lines | 200 code | 19 blank | 0 comment | 0 complexity | 0509ebf7c8691f88a01ea122548f613c MD5 | raw file
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Home Page - My Kendo UI Application</title>
  5. <link href="styles/bootstrap.min.css" rel="stylesheet" type="text/css" />
  6. <link href="styles/site.css" rel="stylesheet" type="text/css" />
  7. <link rel="stylesheet" href="../../styles/kendo.common.min.css">
  8. <link rel="stylesheet" href="../../styles/kendo.rtl.min.css">
  9. <link rel="stylesheet" href="../../styles/kendo.default.min.css">
  10. <link rel="stylesheet" href="../../styles/kendo.mobile.all.min.css">
  11. <script src="../../js/jquery.min.js"></script>
  12. <script src="../../js/kendo.all.min.js"></script>
  13. <script src="../../js/jszip.min.js"></script>
  14. </head>
  15. <body>
  16. <div class="container-fluid">
  17. <div class="row k-header">
  18. <h1>Project Title</h1>
  19. <div id="responsive-panel">
  20. <ul id="menu">
  21. <li>Item 1</li>
  22. <li>Item 2</li>
  23. <li>Item 3</li>
  24. <li>Item 4</li>
  25. <li>Item 5</li>
  26. <li class="k-state-disabled">Disabled item</li>
  27. </ul>
  28. </div>
  29. <button id="configure" class="k-rpanel-toggle k-button k-primary btn-toggle">
  30. <span class="k-icon k-i-hbars"></span>
  31. </button>
  32. </div>
  33. </div>
  34. <div class="container-fluid placeholders">
  35. <div class="row">
  36. <div class="col-xs-4 col-md-2 placeholder">
  37. <img class="img-responsive " alt="200x200" src="images/200.png">
  38. </div>
  39. <div class="col-xs-10 col-md-3">
  40. <h2>Lorem ipsum dolor sit amet...</h2>
  41. <p>
  42. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  43. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a
  44. galley of type and scrambled it to make a type specimen book.
  45. </p>
  46. <p>
  47. <button class="textButton k-primary" id="PrimaryButton">Primary Button</button>
  48. </p>
  49. </div>
  50. <div class="col-xs-10 col-md-3">
  51. <h2>&nbsp;</h2>
  52. <p>
  53. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  54. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a
  55. galley of type and scrambled it to make a type specimen book.
  56. </p>
  57. <p>
  58. <button class="textButton" id="TextButton">Button</button>
  59. </p>
  60. </div>
  61. <div class="col-xs-10 col-md-3">
  62. <h2>&nbsp;</h2>
  63. <p>
  64. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  65. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a
  66. galley of type and scrambled it to make a type specimen book.
  67. </p>
  68. <p>
  69. <button class="textButton" id="Button">Button</button>
  70. </p>
  71. </div>
  72. </div>
  73. </div>
  74. <div class="container-fluid">
  75. <div class="row">
  76. <div class="col-xs-18 col-md-12">
  77. <div id="grid" style="height:550px;"></div>
  78. </div>
  79. </div>
  80. </div>
  81. <div class="container-fluid">
  82. <div class="row">
  83. <div class="col-xs-18 col-md-12">
  84. <div id="grid"></div>
  85. </div>
  86. </div>
  87. </div>
  88. <footer class="footer">
  89. <div class="container-fluid">
  90. <p class="text-muted">Copyright © 2002-2015 Telerik. All rights reserved.</p>
  91. </div>
  92. </footer>
  93. <script>
  94. function sampleData() {
  95. var data = [];
  96. for (var i = 0; i < 50; i++) {
  97. var today = new Date();
  98. today.setDate(today.getDate() + i);
  99. data.push({
  100. OrderID: i,
  101. Freight: i * 10,
  102. OrderDate: today,
  103. ShipName: "ShipName " + i,
  104. ShipCity: "ShipCity " + i
  105. });
  106. }
  107. return data;
  108. }
  109. $(function(){
  110. $("#responsive-panel").kendoResponsivePanel({
  111. breakpoint: 768,
  112. autoClose: false,
  113. orientation: "top"
  114. });
  115. $("#menu").kendoMenu();
  116. $(".textButton").kendoButton();
  117. $("#grid").kendoGrid({
  118. columns: [{
  119. title: "Order ID",
  120. field: "OrderID",
  121. filterable: false,
  122. encoded:true
  123. }, {
  124. title: "Freight",
  125. field: "Freight",
  126. encoded:true
  127. }, {
  128. title: "Order Date",
  129. field: "OrderDate",
  130. format: "{0:MM/dd/yyyy}",
  131. encoded:true
  132. }, {
  133. title: "Ship Name",
  134. field: "ShipName",
  135. encoded:true
  136. }, {
  137. title: "Ship City",
  138. field: "ShipCity",
  139. encoded:true
  140. }],
  141. pageable: {
  142. buttonCount: 10
  143. },
  144. sortable: true,
  145. filterable:true,
  146. messages: {
  147. noRecords: "No records available."
  148. },
  149. dataSource:{
  150. data: sampleData(),
  151. pageSize: 20,
  152. schema: {
  153. model: {
  154. fields: {
  155. OrderID: {
  156. type: "number"
  157. },
  158. CustomerID: {
  159. type: "string"
  160. },
  161. ContactName: {
  162. type: "string"
  163. },
  164. Freight: {
  165. type: "number",
  166. defaultValue: null
  167. },
  168. ShipAddress: {
  169. type: "string"
  170. },
  171. OrderDate: {
  172. type: "date",
  173. defaultValue: null
  174. },
  175. ShippedDate: {
  176. type: "date",
  177. defaultValue: null
  178. },
  179. ShipCountry: {
  180. type: "string"
  181. },
  182. ShipCity: {
  183. type: "string"
  184. },
  185. ShipName: {
  186. type: "string"
  187. },
  188. EmployeeID: {
  189. type: "number",
  190. defaultValue: null
  191. }
  192. }
  193. }
  194. }
  195. }
  196. });
  197. });
  198. </script>
  199. </body>
  200. </html>