row-selector.js 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  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. clickTr: false, // 点击行事件
  12. }, opts);
  13. var checkboxSelector = opts.checkbox,
  14. selectAllSelector = opts.selectAll,
  15. $ckb = $(checkboxSelector);
  16. $(selectAllSelector).on('change', function() {
  17. var cbx = $(checkboxSelector);
  18. for (var i = 0; i < cbx.length; i++) {
  19. if (this.checked && !cbx[i].checked) {
  20. cbx[i].click();
  21. } else if (!this.checked && cbx[i].checked) {
  22. cbx[i].click();
  23. }
  24. }
  25. });
  26. if (opts.clickTr) {
  27. $ckb.click(function (e) {
  28. if (typeof e.cancelBubble != "undefined") {
  29. e.cancelBubble = true;
  30. }
  31. if (typeof e.stopPropagation != "undefined") {
  32. e.stopPropagation();
  33. }
  34. }).parents('tr').click(function (e) {
  35. $(this).find(checkboxSelector).click();
  36. });
  37. }
  38. $ckb.on('change', function () {
  39. var tr = $(this).closest('tr');
  40. if (this.checked) {
  41. tr.css('background-color', opts.bg);
  42. } else {
  43. tr.css('background-color', '');
  44. }
  45. });
  46. this.getIds = function () {
  47. var selected = [];
  48. $(checkboxSelector+':checked').each(function() {
  49. selected.push($(this).data('id'));
  50. });
  51. return selected;
  52. };
  53. this.getRows = function () {
  54. var selected = [];
  55. $(checkboxSelector+':checked').each(function(){
  56. selected.push({'id': $(this).data('id'), 'label': $(this).data('label')})
  57. });
  58. return selected;
  59. };
  60. return this;
  61. };