handsontable.removeRow.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
  1. (function (Handsontable) {
  2. "use strict";
  3. /**
  4. * Handsontable RemoveRow plugin. See `demo/buttons.html` for example usage
  5. * This plugin is not a part of the Handsontable build (to use it, you must load it after loading Handsontable)
  6. * See `test/removeRowSpec.js` for tests
  7. */
  8. function removeRow() {
  9. var eventManager = Handsontable.eventManager(this);
  10. function bindMouseEvents() {
  11. var instance = this;
  12. eventManager.addEventListener(instance.rootElement, 'mouseover', function (e) {
  13. if(checkRowHeader(e.target)) {
  14. var element = getElementFromTargetElement(e.target);
  15. if (element) {
  16. var btn = getButton(element);
  17. if (btn) {
  18. btn.style.display = 'block';
  19. }
  20. }
  21. }
  22. });
  23. eventManager.addEventListener(instance.rootElement, 'mouseout', function (e) {
  24. if(checkRowHeader(e.target)) {
  25. var element = getElementFromTargetElement(e.target);
  26. if (element) {
  27. var btn = getButton(element);
  28. if (btn) {
  29. btn.style.display = 'none';
  30. }
  31. }
  32. }
  33. });
  34. // instance.rootElement.on('mouseover.removeRow', 'tbody th, tbody td', function () {
  35. // getButton(this).show();
  36. // });
  37. //
  38. // instance.rootElement.on('mouseout.removeRow', 'tbody th, tbody td', function () {
  39. // getButton(this).hide();
  40. // });
  41. }
  42. var getElementFromTargetElement = function (element) {
  43. if (element.tagName != 'TABLE') {
  44. if (element.tagName == 'TH' || element.tagName == 'TD') {
  45. return element;
  46. } else {
  47. return getElementFromTargetElement(element.parentNode);
  48. }
  49. }
  50. return null;
  51. };
  52. var checkRowHeader = function (element) {
  53. if (element.tagName != 'BODY') {
  54. if (element.parentNode.tagName == 'TBODY') {
  55. return true;
  56. } else {
  57. element = element.parentNode;
  58. return checkRowHeader(element);
  59. }
  60. }
  61. return false;
  62. };
  63. function unbindMouseEvents() {
  64. eventManager.clear();
  65. }
  66. function getButton(td) {
  67. var btn = td.querySelector('.btn');
  68. if (!btn) {
  69. var parent = td.parentNode.querySelector('th.htRemoveRow');
  70. if (parent) {
  71. btn = parent.querySelector('.btn');
  72. }
  73. }
  74. return btn;
  75. }
  76. this.init = function () {
  77. var instance = this;
  78. var pluginEnabled = !!(instance.getSettings().removeRowPlugin);
  79. if (pluginEnabled) {
  80. bindMouseEvents.call(this);
  81. Handsontable.Dom.addClass(instance.rootElement, 'htRemoveRow');
  82. } else {
  83. unbindMouseEvents.call(this);
  84. Handsontable.Dom.removeClass(instance.rootElement, 'htRemoveRow');
  85. }
  86. };
  87. this.beforeInitWalkontable = function (walkontableConfig) {
  88. var instance = this;
  89. /**
  90. * rowHeaders is a function, so to alter the actual value we need to alter the result returned by this function
  91. */
  92. var baseRowHeaders = walkontableConfig.rowHeaders;
  93. walkontableConfig.rowHeaders = function () {
  94. var pluginEnabled = !!(instance.getSettings().removeRowPlugin);
  95. var newRowHeader = function (row, elem) {
  96. var child
  97. , div;
  98. while (child = elem.lastChild) {
  99. elem.removeChild(child);
  100. }
  101. elem.className = 'htNoFrame htRemoveRow';
  102. if (row > -1) {
  103. div = document.createElement('div');
  104. div.className = 'btn';
  105. div.appendChild(document.createTextNode('x'));
  106. elem.appendChild(div);
  107. eventManager.addEventListener(div, 'mouseup', function () {
  108. instance.alter('remove_row', row);
  109. });
  110. }
  111. };
  112. return pluginEnabled ? Array.prototype.concat.call([], newRowHeader, baseRowHeaders()) : baseRowHeaders();
  113. };
  114. }
  115. }
  116. var htRemoveRow = new removeRow();
  117. Handsontable.hooks.add('beforeInitWalkontable', function (walkontableConfig) {
  118. htRemoveRow.beforeInitWalkontable.call(this, walkontableConfig);
  119. });
  120. Handsontable.hooks.add('beforeInit', function () {
  121. htRemoveRow.init.call(this)
  122. });
  123. Handsontable.hooks.add('afterUpdateSettings', function () {
  124. htRemoveRow.init.call(this)
  125. });
  126. })(Handsontable);