From 5f943a269193747be9fe8e60febd1efa7f22ccbb Mon Sep 17 00:00:00 2001 From: Sunwoo Park Date: Thu, 11 Jun 2015 12:27:55 -0400 Subject: [PATCH 1/4] Added support to change or hide label when no matches found --- README.md | 16 ++++++++++++++++ .../autocomplete-rails-uncompressed.js | 16 ++++++++++++++-- lib/assets/javascripts/autocomplete-rails.js | 2 +- lib/rails-jquery-autocomplete/version.rb | 2 +- 4 files changed, 32 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 53833b9..0736f48 100644 --- a/README.md +++ b/README.md @@ -240,6 +240,22 @@ To have the first item be automatically focused on when the autocomplete menu is Now your autocomplete code is unobtrusive, Rails style. +#### Client-side config + +To configure the behaviour if no matches are found, you can set the following options: + + jQuery.railsAutocomplete.options.showNoMatches //default 'true' (yeah, it's a string) + jQuery.railsAutocomplete.options.noMatchesLabel //default 'no existing matches' + +These will change the behaviour globally. To set them on a single input field use: + + f.autocomplete_field :brand_names, autocomplete_brand_name_products_path, + 'data-showNoMatches' => 'false' + #or + f.autocomplete_field :brand_names, autocomplete_brand_name_products_path, + 'data-noMatchesLabel' => 'no brands found' + + ### Getting the object id If you need to use the id of the selected object, you can use the *id_element* attribute too: diff --git a/lib/assets/javascripts/autocomplete-rails-uncompressed.js b/lib/assets/javascripts/autocomplete-rails-uncompressed.js index abc42ee..fdc3cea 100644 --- a/lib/assets/javascripts/autocomplete-rails-uncompressed.js +++ b/lib/assets/javascripts/autocomplete-rails-uncompressed.js @@ -35,6 +35,10 @@ var _e = e; this.init(_e); }; + jQuery.railsAutocomplete.options = { + showNoMatches: 'true', + noMatchesLabel: 'no existing match' + } jQuery.railsAutocomplete.fn = jQuery.railsAutocomplete.prototype = { railsAutocomplete: '0.0.1' @@ -67,9 +71,17 @@ }); } jQuery.getJSON( jQuery(e).attr('data-autocomplete'), params, function() { - if(arguments[0].length === 0) { + var options = {} + jQuery.extend(options, jQuery.railsAutocomplete.options); + jQuery.each(options, function(key, value) { + if(options.hasOwnProperty(key)) { + var attr_val = jQuery(e).attr('data-' + key); + options[key] = attr_val ? attr_val : value; + } + }); + if(arguments[0].length == 0 && options.showNoMatches == 'true') { arguments[0] = []; - arguments[0][0] = { id: "", label: "no existing match" }; + arguments[0][0] = { id: "", label: options.noMatchesLabel }; } jQuery(arguments[0]).each(function(i, el) { var obj = {}; diff --git a/lib/assets/javascripts/autocomplete-rails.js b/lib/assets/javascripts/autocomplete-rails.js index f0cac3d..2576f62 100644 --- a/lib/assets/javascripts/autocomplete-rails.js +++ b/lib/assets/javascripts/autocomplete-rails.js @@ -1 +1 @@ -!function(t){t.fn.railsAutocomplete=function(){var e=function(){this.railsAutoCompleter||(this.railsAutoCompleter=new t.railsAutocomplete(this))};return void 0!==t.fn.on?t(document).on("focus",this.selector,e):this.live("focus",e)},t.railsAutocomplete=function(t){var e=t;this.init(e)},t.railsAutocomplete.fn=t.railsAutocomplete.prototype={railsAutocomplete:"0.0.1"},t.railsAutocomplete.fn.extend=t.railsAutocomplete.extend=t.extend,t.railsAutocomplete.fn.extend({init:function(e){function a(t){return t.split(e.delimiter)}function i(t){return a(t).pop().replace(/^\s+/,"")}e.delimiter=t(e).attr("data-delimiter")||null,e.min_length=t(e).attr("min-length")||2,e.append_to=t(e).attr("data-append-to")||null,e.autoFocus=t(e).attr("data-auto-focus")||!1,t(e).autocomplete({appendTo:e.append_to,autoFocus:e.autoFocus,delay:t(e).attr("delay")||0,source:function(a,n){var r=this.element[0],o={term:i(a.term)};t(e).attr("data-autocomplete-fields")&&t.each(t.parseJSON(t(e).attr("data-autocomplete-fields")),function(e,a){o[e]=t(a).val()}),t.getJSON(t(e).attr("data-autocomplete"),o,function(){0===arguments[0].length&&(arguments[0]=[],arguments[0][0]={id:"",label:"no existing match"}),t(arguments[0]).each(function(a,i){var n={};n[i.id]=i,t(e).data(n)}),n.apply(null,arguments),t(r).trigger("railsAutocomplete.source",arguments)})},change:function(e,a){if(t(this).is("[data-id-element]")&&""!==t(t(this).attr("data-id-element")).val()&&(t(t(this).attr("data-id-element")).val(a.item?a.item.id:""),t(this).attr("data-update-elements"))){var i=t.parseJSON(t(this).attr("data-update-elements")),n=a.item?t(this).data(a.item.id.toString()):{};if(i&&""===t(i.id).val())return;for(var r in i){var o=t(i[r]);o.is(":checkbox")?null!=n[r]&&o.prop("checked",n[r]):o.val(a.item?n[r]:"")}}},search:function(){var t=i(this.value);return t.length Date: Thu, 11 Jun 2015 18:16:00 -0400 Subject: [PATCH 2/4] Use bool rather than string --- lib/assets/javascripts/autocomplete-rails-uncompressed.js | 4 ++-- lib/assets/javascripts/autocomplete-rails.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/assets/javascripts/autocomplete-rails-uncompressed.js b/lib/assets/javascripts/autocomplete-rails-uncompressed.js index fdc3cea..ecd6910 100644 --- a/lib/assets/javascripts/autocomplete-rails-uncompressed.js +++ b/lib/assets/javascripts/autocomplete-rails-uncompressed.js @@ -36,7 +36,7 @@ this.init(_e); }; jQuery.railsAutocomplete.options = { - showNoMatches: 'true', + showNoMatches: true, noMatchesLabel: 'no existing match' } @@ -79,7 +79,7 @@ options[key] = attr_val ? attr_val : value; } }); - if(arguments[0].length == 0 && options.showNoMatches == 'true') { + if(arguments[0].length == 0 && options.showNoMatches) { arguments[0] = []; arguments[0][0] = { id: "", label: options.noMatchesLabel }; } diff --git a/lib/assets/javascripts/autocomplete-rails.js b/lib/assets/javascripts/autocomplete-rails.js index 2576f62..f942d19 100644 --- a/lib/assets/javascripts/autocomplete-rails.js +++ b/lib/assets/javascripts/autocomplete-rails.js @@ -1 +1 @@ -!function(t){t.fn.railsAutocomplete=function(){var e=function(){this.railsAutoCompleter||(this.railsAutoCompleter=new t.railsAutocomplete(this))};return void 0!==t.fn.on?t(document).on("focus",this.selector,e):this.live("focus",e)},t.railsAutocomplete=function(t){var e=t;this.init(e)},t.railsAutocomplete.options={showNoMatches:"true",noMatchesLabel:"no existing match"},t.railsAutocomplete.fn=t.railsAutocomplete.prototype={railsAutocomplete:"0.0.1"},t.railsAutocomplete.fn.extend=t.railsAutocomplete.extend=t.extend,t.railsAutocomplete.fn.extend({init:function(e){function a(t){return t.split(e.delimiter)}function i(t){return a(t).pop().replace(/^\s+/,"")}e.delimiter=t(e).attr("data-delimiter")||null,e.min_length=t(e).attr("min-length")||2,e.append_to=t(e).attr("data-append-to")||null,e.autoFocus=t(e).attr("data-auto-focus")||!1,t(e).autocomplete({appendTo:e.append_to,autoFocus:e.autoFocus,delay:t(e).attr("delay")||0,source:function(a,n){var o=this.element[0],r={term:i(a.term)};t(e).attr("data-autocomplete-fields")&&t.each(t.parseJSON(t(e).attr("data-autocomplete-fields")),function(e,a){r[e]=t(a).val()}),t.getJSON(t(e).attr("data-autocomplete"),r,function(){var a={};t.extend(a,t.railsAutocomplete.options),t.each(a,function(i,n){if(a.hasOwnProperty(i)){var o=t(e).attr("data-"+i);a[i]=o?o:n}}),0==arguments[0].length&&"true"==a.showNoMatches&&(arguments[0]=[],arguments[0][0]={id:"",label:a.noMatchesLabel}),t(arguments[0]).each(function(a,i){var n={};n[i.id]=i,t(e).data(n)}),n.apply(null,arguments),t(o).trigger("railsAutocomplete.source",arguments)})},change:function(e,a){if(t(this).is("[data-id-element]")&&""!==t(t(this).attr("data-id-element")).val()&&(t(t(this).attr("data-id-element")).val(a.item?a.item.id:""),t(this).attr("data-update-elements"))){var i=t.parseJSON(t(this).attr("data-update-elements")),n=a.item?t(this).data(a.item.id.toString()):{};if(i&&""===t(i.id).val())return;for(var o in i){var r=t(i[o]);r.is(":checkbox")?null!=n[o]&&r.prop("checked",n[o]):r.val(a.item?n[o]:"")}}},search:function(){var t=i(this.value);return t.length Date: Thu, 11 Jun 2015 18:26:02 -0400 Subject: [PATCH 3/4] Updated README.md --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 0736f48..5060144 100644 --- a/README.md +++ b/README.md @@ -244,13 +244,13 @@ Now your autocomplete code is unobtrusive, Rails style. To configure the behaviour if no matches are found, you can set the following options: - jQuery.railsAutocomplete.options.showNoMatches //default 'true' (yeah, it's a string) - jQuery.railsAutocomplete.options.noMatchesLabel //default 'no existing matches' + jQuery.railsAutocomplete.options.showNoMatches //default true + jQuery.railsAutocomplete.options.noMatchesLabel //default 'no existing match' These will change the behaviour globally. To set them on a single input field use: f.autocomplete_field :brand_names, autocomplete_brand_name_products_path, - 'data-showNoMatches' => 'false' + 'data-showNoMatches' => false #or f.autocomplete_field :brand_names, autocomplete_brand_name_products_path, 'data-noMatchesLabel' => 'no brands found' From 919cb0637b711f7c9a72d47a0ba94f4d9439106d Mon Sep 17 00:00:00 2001 From: Sunwoo Park Date: Thu, 11 Jun 2015 18:33:51 -0400 Subject: [PATCH 4/4] Fixed formatting --- lib/assets/javascripts/autocomplete-rails-uncompressed.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/assets/javascripts/autocomplete-rails-uncompressed.js b/lib/assets/javascripts/autocomplete-rails-uncompressed.js index ecd6910..ede6cc0 100644 --- a/lib/assets/javascripts/autocomplete-rails-uncompressed.js +++ b/lib/assets/javascripts/autocomplete-rails-uncompressed.js @@ -71,12 +71,12 @@ }); } jQuery.getJSON( jQuery(e).attr('data-autocomplete'), params, function() { - var options = {} + var options = {}; jQuery.extend(options, jQuery.railsAutocomplete.options); jQuery.each(options, function(key, value) { if(options.hasOwnProperty(key)) { - var attr_val = jQuery(e).attr('data-' + key); - options[key] = attr_val ? attr_val : value; + var attrVal = jQuery(e).attr('data-' + key); + options[key] = attrVal ? attrVal : value; } }); if(arguments[0].length == 0 && options.showNoMatches) {