row-selector.js 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. /**
  2. * 行选择器
  3. *
  4. * @constructor
  5. */
  6. LA.RowSelector = function RowSelector(opts) {
  7. opts = $.extend({
  8. checkbox: '', // checkbox css选择器
  9. selectAll: '', // 全选checkbox css选择器
  10. bg: 'rgba(255, 255,213,0.4)', // 选中效果颜色
  11. getSelectedRowsMethod: 'getSelectRows',
  12. clickTr: false, // 点击行事件
  13. }, opts);
  14. var checkboxSelector = opts.checkbox,
  15. selectAllSelector = opts.selectAll,
  16. $ckb = $(checkboxSelector);
  17. $(selectAllSelector).on('change', function() {
  18. var cbx = $(checkboxSelector);
  19. for (var i = 0; i < cbx.length; i++) {
  20. if (this.checked && !cbx[i].checked) {
  21. cbx[i].click();
  22. } else if (!this.checked && cbx[i].checked) {
  23. cbx[i].click();
  24. }
  25. }
  26. });
  27. if (opts.clickTr) {
  28. $ckb.click(function (e) {
  29. if (typeof e.cancelBubble != "undefined") {
  30. e.cancelBubble = true;
  31. }
  32. if (typeof e.stopPropagation != "undefined") {
  33. e.stopPropagation();
  34. }
  35. }).parents('tr').click(function (e) {
  36. $(this).find(checkboxSelector).click();
  37. });
  38. }
  39. $ckb.on('change', function () {
  40. var tr = $(this).closest('tr');
  41. if (this.checked) {
  42. tr.css('background-color', opts.bg);
  43. } else {
  44. tr.css('background-color', '');
  45. }
  46. });
  47. this.getIds = window[opts.getSelectedRowsMethod] = function () {
  48. var selected = [];
  49. $(checkboxSelector+':checked').each(function() {
  50. selected.push($(this).data('id'));
  51. });
  52. return selected;
  53. };
  54. this.getItems = window[opts.getSelectedRowsMethod + 'Options'] = function () {
  55. var selected = [];
  56. $(checkboxSelector+':checked').each(function(){
  57. selected.push({'id': $(this).data('id'), 'label': $(this).data('label')})
  58. });
  59. return selected;
  60. };
  61. return this;
  62. };