footable-init.js 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. $(window).on('load', function() {
  2. // Row Toggler
  3. // -----------------------------------------------------------------
  4. $('#demo-foo-row-toggler').footable();
  5. // Accordion
  6. // -----------------------------------------------------------------
  7. $('#demo-foo-accordion').footable().on('footable_row_expanded', function(e) {
  8. $('#demo-foo-accordion tbody tr.footable-detail-show').not(e.row).each(function() {
  9. $('#demo-foo-accordion').data('footable').toggleDetail(this);
  10. });
  11. });
  12. // Pagination
  13. // -----------------------------------------------------------------
  14. $('#demo-foo-pagination').footable();
  15. $('#demo-show-entries').change(function (e) {
  16. e.preventDefault();
  17. var pageSize = $(this).val();
  18. $('#demo-foo-pagination').data('page-size', pageSize);
  19. $('#demo-foo-pagination').trigger('footable_initialized');
  20. });
  21. // Filtering
  22. // -----------------------------------------------------------------
  23. var filtering = $('#demo-foo-filtering');
  24. filtering.footable().on('footable_filtering', function (e) {
  25. var selected = $('#demo-foo-filter-status').find(':selected').val();
  26. e.filter += (e.filter && e.filter.length > 0) ? ' ' + selected : selected;
  27. e.clear = !e.filter;
  28. });
  29. // Filter status
  30. $('#demo-foo-filter-status').change(function (e) {
  31. e.preventDefault();
  32. filtering.trigger('footable_filter', {filter: $(this).val()});
  33. });
  34. // Search input
  35. $('#demo-foo-search').on('input', function (e) {
  36. e.preventDefault();
  37. filtering.trigger('footable_filter', {filter: $(this).val()});
  38. });
  39. // Search input
  40. $('#demo-input-search2').on('input', function (e) {
  41. e.preventDefault();
  42. addrow.trigger('footable_filter', {filter: $(this).val()});
  43. });
  44. // Add & Remove Row
  45. var addrow = $('#demo-foo-addrow');
  46. addrow.footable().on('click', '.delete-row-btn', function() {
  47. //get the footable object
  48. var footable = addrow.data('footable');
  49. //get the row we are wanting to delete
  50. var row = $(this).parents('tr:first');
  51. //delete the row
  52. footable.removeRow(row);
  53. });
  54. // Add Row Button
  55. $('#demo-btn-addrow').click(function() {
  56. //get the footable object
  57. var footable = addrow.data('footable');
  58. //build up the row we are wanting to add
  59. var newRow = '<tr><td>thome</td><td>Woldt</td><td>Airline Transport Pilot</td><td>3 Oct 2016</td><td><span class="label label-table label-success">Active</span></td><td><button type="button" class="btn btn-sm btn-icon btn-pure btn-outline delete-row-btn" data-toggle="tooltip" data-original-title="Delete"><i class="ti-close" aria-hidden="true"></i></button></td></tr>';
  60. //add it
  61. footable.appendRow(newRow);
  62. });
  63. });