Нет описания

jquery.grp_autocomplete_generic.js 7.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. /**
  2. * GRAPPELLI AUTOCOMPLETE GENERIC
  3. * generic lookup with autocomplete
  4. */
  5. (function($){
  6. var methods = {
  7. init: function(options) {
  8. options = $.extend({}, $.fn.grp_autocomplete_generic.defaults, options);
  9. return this.each(function() {
  10. var $this = $(this);
  11. // assign attributes
  12. $this.attr({
  13. "tabindex": "-1",
  14. "readonly": "readonly"
  15. }).addClass("grp-autocomplete-hidden-field");
  16. // build autocomplete wrapper
  17. var val = $(options.content_type).val() || $(options.content_type).find(':checked').val();
  18. if (val) {
  19. $this.after(loader).after(remove_link($this.attr('id'))).after(lookup_link($this.attr("id"),val));
  20. }
  21. $this.parent().wrapInner("<div class='grp-autocomplete-wrapper-fk'></div>");
  22. $this.parent().prepend("<input id='" + $this.attr("id") + "-autocomplete' type='text' class='vTextField' value='' />");
  23. // defaults
  24. options = $.extend({
  25. wrapper_autocomplete: $(this).parent(),
  26. input_field: $(this).prev(),
  27. remove_link: $this.nextAll("a.grp-related-remove").hide(),
  28. loader: $this.nextAll("div.grp-loader").hide()
  29. }, $.fn.grp_autocomplete_generic.defaults, options);
  30. // lookup
  31. if (val) {
  32. lookup_id($this, options); // lookup when loading page
  33. }
  34. lookup_autocomplete($this, options); // autocomplete-handler
  35. $this.on("change focus keyup", function() { // id-handler
  36. lookup_id($this, options);
  37. });
  38. $(options.content_type).on("change", function() { // content-type-handler
  39. update_lookup($(this), options);
  40. });
  41. // labels
  42. $("label[for='"+$this.attr('id')+"']").each(function() {
  43. $(this).attr("for", $this.attr("id")+"-autocomplete");
  44. });
  45. });
  46. }
  47. };
  48. $.fn.grp_autocomplete_generic = function(method) {
  49. if (methods[method]) {
  50. return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
  51. } else if (typeof method === 'object' || ! method) {
  52. return methods.init.apply(this, arguments);
  53. } else {
  54. $.error('Method ' + method + ' does not exist on jQuery.grp_autocomplete_generic');
  55. }
  56. return false;
  57. };
  58. var loader = function() {
  59. var loader = $('<div class="grp-loader">loader</div>');
  60. return loader;
  61. };
  62. var remove_link = function(id) {
  63. var removelink = $('<a class="grp-related-remove"></a>');
  64. removelink.attr('id', 'remove_'+id);
  65. removelink.attr('href', 'javascript://');
  66. removelink.attr('onClick', 'return removeRelatedObject(this);');
  67. removelink.hover(function() {
  68. $(this).parent().toggleClass("grp-autocomplete-preremove");
  69. });
  70. return removelink;
  71. };
  72. var lookup_link = function(id, val) {
  73. var lookuplink = $('<a class="related-lookup"></a>');
  74. lookuplink.attr('id', 'lookup_'+id);
  75. lookuplink.attr('href', window.ADMIN_URL + MODEL_URL_ARRAY[val].app + "/" + MODEL_URL_ARRAY[val].model + '/?');
  76. lookuplink.attr('onClick', 'return showRelatedObjectLookupPopup(this);');
  77. return lookuplink;
  78. };
  79. var update_lookup = function(elem, options) {
  80. var obj = $(options.object_id);
  81. obj.val('');
  82. obj.prev().val('');
  83. // remove loader, a-related, related-lookup
  84. obj.nextAll("a.related-lookup").remove();
  85. obj.nextAll("a.grp-related-remove").remove();
  86. obj.nextAll("div.grp-loader").remove();
  87. var val = $(elem).val() || $(elem).find(':checked').val();
  88. if (val) {
  89. obj.after(loader).after(remove_link(obj.attr('id'))).after(lookup_link(obj.attr('id'),val));
  90. options.remove_link = obj.nextAll("a.grp-related-remove").hide();
  91. options.loader = obj.nextAll("div.grp-loader").hide();
  92. }
  93. };
  94. var lookup_autocomplete = function(elem, options) {
  95. options.wrapper_autocomplete.find("input:first")
  96. .on("focus", function() {
  97. options.wrapper_autocomplete.addClass("grp-state-focus");
  98. })
  99. .on("blur", function() {
  100. options.wrapper_autocomplete.removeClass("grp-state-focus");
  101. })
  102. .autocomplete({
  103. minLength: 1,
  104. autoFocus: true,
  105. delay: 1000,
  106. source: function(request, response) {
  107. $.ajax({
  108. url: options.autocomplete_lookup_url,
  109. dataType: 'json',
  110. data: "term=" + encodeURIComponent(request.term) + "&app_label=" + grappelli.get_app_label(elem) + "&model_name=" + grappelli.get_model_name(elem) + "&query_string=" + grappelli.get_query_string(elem),
  111. beforeSend: function (XMLHttpRequest) {
  112. var val = $(options.content_type).val() || $(options.content_type).find(':checked').val();
  113. if (val) {
  114. options.loader.show();
  115. } else {
  116. return false;
  117. }
  118. },
  119. success: function(data){
  120. response($.map(data, function(item) {
  121. return {label: item.label, value: item.value};
  122. }));
  123. },
  124. complete: function (XMLHttpRequest, textStatus) {
  125. options.loader.hide();
  126. }
  127. });
  128. },
  129. focus: function() { // prevent value inserted on focus
  130. return false;
  131. },
  132. select: function(event, ui) {
  133. options.input_field.val(ui.item.label);
  134. elem.val(ui.item.value);
  135. elem.trigger('change');
  136. elem.val() ? $(options.remove_link).show() : $(options.remove_link).hide();
  137. return false;
  138. }
  139. })
  140. .data("ui-autocomplete")._renderItem = function(ul,item) {
  141. if (!item.value) {
  142. return $("<li class='ui-state-disabled'></li>")
  143. .data( "item.autocomplete", item )
  144. .append($("<span class='error'></span>").text(item.label))
  145. .appendTo(ul);
  146. } else {
  147. return $("<li></li>")
  148. .data( "item.autocomplete", item )
  149. .append($("<a></a>").text(item.label))
  150. .appendTo(ul);
  151. }
  152. };
  153. };
  154. var lookup_id = function(elem, options) {
  155. $.getJSON(options.lookup_url, {
  156. object_id: elem.val(),
  157. app_label: grappelli.get_app_label(elem),
  158. model_name: grappelli.get_model_name(elem)
  159. }, function(data) {
  160. $.each(data, function(index) {
  161. options.input_field.val(data[index].label);
  162. elem.val() ? $(options.remove_link).show() : $(options.remove_link).hide();
  163. });
  164. });
  165. };
  166. $.fn.grp_autocomplete_generic.defaults = {
  167. autocomplete_lookup_url: '',
  168. lookup_url: '',
  169. content_type: '',
  170. object_id: ''
  171. };
  172. })(grp.jQuery);