yii.gridView.js 7.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. /**
  2. * Yii GridView widget.
  3. *
  4. * This is the JavaScript widget used by the yii\grid\GridView widget.
  5. *
  6. * @link http://www.yiiframework.com/
  7. * @copyright Copyright (c) 2008 Yii Software LLC
  8. * @license http://www.yiiframework.com/license/
  9. * @author Qiang Xue <qiang.xue@gmail.com>
  10. * @since 2.0
  11. */
  12. (function ($) {
  13. $.fn.yiiGridView = function (method) {
  14. if (methods[method]) {
  15. return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
  16. } else if (typeof method === 'object' || !method) {
  17. return methods.init.apply(this, arguments);
  18. } else {
  19. $.error('Method ' + method + ' does not exist on jQuery.yiiGridView');
  20. return false;
  21. }
  22. };
  23. var defaults = {
  24. filterUrl: undefined,
  25. filterSelector: undefined
  26. };
  27. var gridData = {};
  28. var gridEvents = {
  29. /**
  30. * beforeFilter event is triggered before filtering the grid.
  31. * The signature of the event handler should be:
  32. * function (event)
  33. * where
  34. * - event: an Event object.
  35. *
  36. * If the handler returns a boolean false, it will stop filter form submission after this event. As
  37. * a result, afterFilter event will not be triggered.
  38. */
  39. beforeFilter: 'beforeFilter',
  40. /**
  41. * afterFilter event is triggered after filtering the grid and filtered results are fetched.
  42. * The signature of the event handler should be:
  43. * function (event)
  44. * where
  45. * - event: an Event object.
  46. */
  47. afterFilter: 'afterFilter'
  48. };
  49. var methods = {
  50. init: function (options) {
  51. return this.each(function () {
  52. var $e = $(this);
  53. var settings = $.extend({}, defaults, options || {});
  54. var id = $e.attr('id');
  55. if (gridData[id] === undefined) {
  56. gridData[id] = {};
  57. }
  58. gridData[id] = $.extend(gridData[id], {settings: settings});
  59. var enterPressed = false;
  60. $(document).off('change.yiiGridView keydown.yiiGridView', settings.filterSelector)
  61. .on('change.yiiGridView keydown.yiiGridView', settings.filterSelector, function (event) {
  62. if (event.type === 'keydown') {
  63. if (event.keyCode !== 13) {
  64. return; // only react to enter key
  65. } else {
  66. enterPressed = true;
  67. }
  68. } else {
  69. // prevent processing for both keydown and change events
  70. if (enterPressed) {
  71. enterPressed = false;
  72. return;
  73. }
  74. }
  75. methods.applyFilter.apply($e);
  76. return false;
  77. });
  78. });
  79. },
  80. applyFilter: function () {
  81. var $grid = $(this), event;
  82. var settings = gridData[$grid.attr('id')].settings;
  83. var data = {};
  84. $.each($(settings.filterSelector).serializeArray(), function () {
  85. if (!(this.name in data)) {
  86. data[this.name] = [];
  87. }
  88. data[this.name].push(this.value);
  89. });
  90. var namesInFilter = Object.keys(data);
  91. $.each(yii.getQueryParams(settings.filterUrl), function (name, value) {
  92. if (namesInFilter.indexOf(name) === -1 && namesInFilter.indexOf(name.replace(/\[\]$/, '')) === -1) {
  93. if (!$.isArray(value)) {
  94. value = [value];
  95. }
  96. if (!(name in data)) {
  97. data[name] = value;
  98. } else {
  99. $.each(value, function (i, val) {
  100. if ($.inArray(val, data[name])) {
  101. data[name].push(val);
  102. }
  103. });
  104. }
  105. }
  106. });
  107. var pos = settings.filterUrl.indexOf('?');
  108. var url = pos < 0 ? settings.filterUrl : settings.filterUrl.substring(0, pos);
  109. $grid.find('form.gridview-filter-form').remove();
  110. var $form = $('<form/>', {
  111. action: url,
  112. method: 'get',
  113. 'class': 'gridview-filter-form',
  114. style: 'display:none',
  115. 'data-pjax': ''
  116. }).appendTo($grid);
  117. $.each(data, function (name, values) {
  118. $.each(values, function (index, value) {
  119. $form.append($('<input/>').attr({type: 'hidden', name: name, value: value}));
  120. });
  121. });
  122. event = $.Event(gridEvents.beforeFilter);
  123. $grid.trigger(event);
  124. if (event.result === false) {
  125. return;
  126. }
  127. $form.submit();
  128. $grid.trigger(gridEvents.afterFilter);
  129. },
  130. setSelectionColumn: function (options) {
  131. var $grid = $(this);
  132. var id = $(this).attr('id');
  133. if (gridData[id] === undefined) {
  134. gridData[id] = {};
  135. }
  136. gridData[id].selectionColumn = options.name;
  137. if (!options.multiple || !options.checkAll) {
  138. return;
  139. }
  140. var checkAll = "#" + id + " input[name='" + options.checkAll + "']";
  141. var inputs = options.class ? "input." + options.class : "input[name='" + options.name + "']";
  142. var inputsEnabled = "#" + id + " " + inputs + ":enabled";
  143. $(document).off('click.yiiGridView', checkAll).on('click.yiiGridView', checkAll, function () {
  144. $grid.find(inputs + ":enabled").prop('checked', this.checked);
  145. });
  146. $(document).off('click.yiiGridView', inputsEnabled).on('click.yiiGridView', inputsEnabled, function () {
  147. var all = $grid.find(inputs).length == $grid.find(inputs + ":checked").length;
  148. $grid.find("input[name='" + options.checkAll + "']").prop('checked', all);
  149. });
  150. },
  151. getSelectedRows: function () {
  152. var $grid = $(this);
  153. var data = gridData[$grid.attr('id')];
  154. var keys = [];
  155. if (data.selectionColumn) {
  156. $grid.find("input[name='" + data.selectionColumn + "']:checked").each(function () {
  157. keys.push($(this).parent().closest('tr').data('key'));
  158. });
  159. }
  160. return keys;
  161. },
  162. destroy: function () {
  163. return this.each(function () {
  164. $(window).unbind('.yiiGridView');
  165. $(this).removeData('yiiGridView');
  166. });
  167. },
  168. data: function () {
  169. var id = $(this).attr('id');
  170. return gridData[id];
  171. }
  172. };
  173. })(window.jQuery);