1

Rails 3.2 のフィールドに特別な動作をするオートコンプリートを実装しようとしています。Rails autocomplete gem を使用していますが、やりたいことは次のとおりです。

オートコンプリートを機能させたいフォームに、レシピ材料の数量と数量のタイプを含むフィールドがあります。入力の 3 つの異なる例:

100 gramms
2 pices
3.2 kilos

ユーザーがリスト内のすべての利用可能なオプションでスペースを押したときに、動作にドロップダウンが必要です。ユーザーが別のキーを入力すると、もちろんリストはその入力をフィルタリングします。

上記の動作のためにレールのオートコンプリートをカスタマイズすることは可能ですか?

4

2 に答える 2

0

純粋なjsソリューションもあるため、コントローラーでシンプルに保つことができます

# units controller
autocomplete :unit, :name

rails3-jquery-autocomplete js ドライバーを変更する必要があります。

重要な行の 1 つがこれです。 https://github.com/crowdint/rails3-jquery-autocomplete/blob/master/lib/assets/javascripts/autocomplete-rails-uncompressed.js#L45 ここで、ユーザー入力がサーバーに送信される実際の用語にどのように関連するかをカスタマイズできます完了。

問題は、選択時に挿入された値に数量が含まれていることも確認する必要があることです。この値はサーバーの json 応答から取得されるため、数量をサーバーに送信しない場合は、抽出時に js 属性で覚えておく必要があります。

function extractLast( term ) {
  var last = split( term ).pop().replace(/^\s+/,"");
  var arr = last.split(/\s+/);
  if (arr.length > 1) {  
     var res = arr.pop();
     jQuery(this).attr('data-quantity').val(arr.join(' '));
  }
  return res;
}

それをオンラインに挿入し ます https://github.com/crowdint/rails3-jquery-autocomplete/blob/master/lib/assets/javascripts/autocomplete-rails-uncompressed.js#L77

terms.push( (jQuery(this).attr('data-quantity')) + ' ' + ui.item.value );

確かに、より良いコードは、これを私の受け入れられた回答のように入力フィールドのデータ属性に依存させるでしょう。

このソリューションでは、成分の解析や数量に基づくユニットのフィルタリングも許可されません。これは、ユニットの一部のみがリクエストで送信されるためです。

于 2012-06-02T15:56:29.203 に答える
0

UPDATED. My original answer misunderstood the question.

Fisrt option.

You modify your controller action.

# units_controller
def autocomplete
   term = params[:term]
   quantity, unit = term.split(/\s/)
   items = unit ? Unit.where('units.name LIKE ?',"#{unit}%") : []
   json = items.collect do |item| 
     { "id" => item.id.to_s, 
       "label" => item.name, 
       "value" => "#{quantity} #{item.name} "  
     }
   end
   render json: json
end

While the autocomplete behaviour will already be correct, this solution is suboptimal since it hits the server even while i am typing the quantity (and gives no results).

A complete solution involves patching the rails autocompleter driver. Keep the abaove custom controller action and just put a custom minLength function https://github.com/crowdint/rails3-jquery-autocomplete/blob/master/lib/assets/javascripts/autocomplete-rails-uncompressed.js#L63

you modify this section as:

   search: function() {
     // custom minLength
     var term = extractLast( this.value );
     var filter = jQuery(this).attr('data-input-filter');
     if (filter != null) { 
        var re = new RegExp(filter,"");
        term = term.replace(re, "$1"); //ignore parts of it
     }
     if ( term.length < 1 ) { //modify to 1
       return false;
     }
   },

now if you put this minlength filter to your field tag

'data-input-filter' => j("^.*\s+([^\s]+)$")

it will correctly ignore the first bit (upto after the last white space) of the user input and only hits the server when you reach the first character of the unit. (little unsure of escapes here)

An advantage of this approach is that you could add ingredient autocompletion to your controller, and use comma and get multiple ingredients input simply by adding this option to autocomplete text field helper:

"data-delimiter" => ','

Then you can properly autocomplete inputs like:

1 kilo flour, 2 spoons sugar, 100 gramms yeast.
于 2012-05-23T23:36:11.463 に答える