table.html 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <th:block th:include="include :: header('弹层表格')" />
  5. </head>
  6. <body class="gray-bg">
  7. <div class="wrapper wrapper-content fadeInRight">
  8. <div class="row">
  9. <div class="col-sm-12">
  10. <div class="ibox">
  11. <div class="ibox-title">
  12. <h5>弹层框</h5>
  13. </div>
  14. <div class="ibox-content" id="test">
  15. <p>弹出复选框表格及单选框表格(点击提交后得到数据)。 </p>
  16. <button type="button" class="btn btn-primary" onclick="selectCheckUser()">弹出表格(复选框)</button>
  17. <button type="button" class="btn btn-success" onclick="selectRadioUser()">弹出表格(单选框)</button>
  18. </div>
  19. </div>
  20. </div>
  21. <div class="col-sm-12">
  22. <div class="ibox">
  23. <div class="ibox-title">
  24. <h5>弹层框</h5>
  25. </div>
  26. <div class="ibox-content" id="test">
  27. <p>弹出复选框表格及单选框表格(点击提交后得到数据并回显到父窗体)。 </p>
  28. <button type="button" class="btn btn-info" onclick="selectUsersToParent()">弹出表格(复选框)</button>
  29. <p id="userids"> </p>
  30. </div>
  31. </div>
  32. </div>
  33. </div>
  34. </div>
  35. <th:block th:include="include :: footer" />
  36. <script type="text/javascript">
  37. var prefix = ctx + "demo/modal";
  38. function selectCheckUser(){
  39. $.modal.open("选择用户", prefix + "/check");
  40. }
  41. function selectRadioUser(){
  42. $.modal.open("选择用户", prefix + "/radio");
  43. }
  44. function selectUsersToParent(){
  45. $.modal.open("选择用户", prefix + "/parent");
  46. }
  47. function selectUsers(){
  48. alert(1);
  49. }
  50. </script>
  51. </body>
  52. </html>