index.pre.html 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Repeater</title>
  6. <title>jquery.repeater</title>
  7. <style>
  8. html, body {
  9. font-family: Helvetica, Arial, sans-serif;
  10. color: rgb(80, 80, 80);
  11. }
  12. </style>
  13. </head>
  14. <body>
  15. <h2>Repeater</h2>
  16. <!-- @include repeater.html -->
  17. <h2>Nested</h2>
  18. <!-- @include nested-repeater.html -->
  19. <script src="jquery-3.7.0.min.js"></script>
  20. <script src="jquery.repeater.js"></script>
  21. <script>
  22. $(document).ready(function () {
  23. 'use strict';
  24. $('.repeater').repeater({
  25. defaultValues: {
  26. 'textarea-input': 'foo',
  27. 'text-input': 'bar',
  28. 'select-input': 'B',
  29. 'checkbox-input': ['A', 'B'],
  30. 'radio-input': 'B'
  31. },
  32. show: function () {
  33. $(this).slideDown();
  34. },
  35. hide: function (deleteElement) {
  36. if(confirm('Are you sure you want to delete this element?')) {
  37. $(this).slideUp(deleteElement);
  38. }
  39. },
  40. ready: function (setIndexes) {
  41. }
  42. });
  43. window.outerRepeater = $('.outer-repeater').repeater({
  44. isFirstItemUndeletable: true,
  45. defaultValues: { 'text-input': 'outer-default' },
  46. show: function () {
  47. console.log('outer show');
  48. $(this).slideDown();
  49. },
  50. hide: function (deleteElement) {
  51. console.log('outer delete');
  52. $(this).slideUp(deleteElement);
  53. },
  54. repeaters: [{
  55. isFirstItemUndeletable: true,
  56. selector: '.inner-repeater',
  57. defaultValues: { 'inner-text-input': 'inner-default' },
  58. show: function () {
  59. console.log('inner show');
  60. $(this).slideDown();
  61. },
  62. hide: function (deleteElement) {
  63. console.log('inner delete');
  64. $(this).slideUp(deleteElement);
  65. }
  66. }]
  67. });
  68. });
  69. </script>
  70. </body>
  71. </html>