select2tree.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. (function ($) {
  2. $.fn.select2tree = function (options) {
  3. var defaults = {
  4. language: "zh-CN",
  5. minimumResultsForSearch: -1
  6. /*theme: "bootstrap"*/
  7. };
  8. var opts = $.extend(defaults, options);
  9. opts.templateResult = function (data, container) {
  10. if (data.element) {
  11. //insert span element and add 'parent' property
  12. var $wrapper = $("<span style=\"margin-right:6px;\"></span><span>" + data.text + "</span>");
  13. var $element = $(data.element);
  14. $(container).attr("val", $element.val());
  15. if ($element.attr("parent")) {
  16. $(container).attr("parent", $element.attr("parent"));
  17. }
  18. return $wrapper;
  19. } else {
  20. return data.text;
  21. }
  22. };
  23. var $that = $(this);
  24. $(this).select2(opts).on("select2:open",open);
  25. };
  26. function moveOption(id, index) {
  27. index = index || 0;
  28. if (id) {
  29. $(".select2-results__options li[parent=" + id + "]").insertAfter(".select2-results__options li[val=" + id + "]");
  30. $(".select2-results__options li[parent=" + id + "]").each(function () {
  31. $(this).attr('level', index);
  32. moveOption($(this).attr("val"), index + 1);
  33. });
  34. } else {
  35. $(".select2-results__options li:not([parent])").appendTo(".select2-results__options ul");
  36. $(".select2-results__options li:not([parent])").each(function () {
  37. $(this).attr('level', index);
  38. moveOption($(this).attr("val"), index + 1);
  39. });
  40. }
  41. }
  42. //deal switch action
  43. function switchAction(id, open, isAll) {
  44. if (!id||$(".select2-results__options li[parent='" + id + "']").length<=0) {
  45. return;
  46. }
  47. if (isAll&&$(".select2-results__options li[val=" + id + "][level='1']").length>0) {
  48. return;
  49. }
  50. if (open) {
  51. $(".select2-results__options li[val=" + id + "] span[class]:eq(0)").removeClass("icon-add").addClass("icon-delete");
  52. //$(".select2-results__options li[parent='" + id + "']").slideDown();
  53. } else {
  54. $(".select2-results__options li[val=" + id + "] span[class]:eq(0)").addClass("icon-add").removeClass("icon-delete");
  55. // $(".select2-results__options li[parent='" + id + "']").slideUp();
  56. }
  57. $(".select2-results__options li[parent='" + id + "']").each(function() {
  58. var $that = $(this);
  59. open ? $that.slideDown() : $that.slideUp();
  60. switchAction($that.attr("val"), open, isAll);
  61. });
  62. }
  63. function open() {
  64. setTimeout(function () {
  65. moveOption();
  66. $(".select2-results__options li").each(function () {
  67. var $this = $(this);
  68. $this.find("span:eq(0)").addClass('iconfont icon-safety-certificate');
  69. if ($this.attr("parent")) {
  70. $(this).siblings("li[val=" + $this.attr("parent") + "]").find("span:eq(0)")
  71. .removeClass("icon-ban").addClass("icon-add switch").css({"cursor": "pointer"});
  72. $(this).siblings("li[val=" + $this.attr("parent") + "]").find("span:eq(1)").css("font-weight", "bold");
  73. }
  74. if (!$this.attr("style")) {
  75. var level = $this.attr("level");
  76. var paddingLeft = level;
  77. $("li[parent='" + $this.attr("parent") + "']").css("display", "none").css("padding-left", paddingLeft + "em");
  78. }
  79. });
  80. $(".select2-results__options li[level='0']").each(function () {
  81. var $this = $(this);
  82. var id = $this.attr("val");
  83. switchAction(id, true, true);
  84. });
  85. //override mousedown for collapse/expand
  86. $(".switch").off("mousedown").on("mousedown", function (event) {
  87. switchAction($(this).parent().attr("val"), $(this).hasClass("icon-add"));
  88. event.stopPropagation();
  89. event.preventDefault();
  90. });
  91. //override mouseup to nothing
  92. $(".switch").off("mouseup").on("mouseup", function () {
  93. return false;
  94. });
  95. }, 0);
  96. }
  97. })(jQuery);