1

私はレールとJavaScriptが初めてで、私の人生ではこれを機能させることができません。そのため、ブートストラップの先行入力を使用してオートコンプリート機能を取得しようとしていますが、障害物にぶつかり続けています。

まず、このサイトの例を試してみると、すべてがうまく機能します。私のview中で私は持っています

<input input="text" name="query" id="search" autocomplete="off" />

私のapplication.js中で私は持っています

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require twitter/bootstrap
//= require jquery-fileupload/basic
//= require_tree .

私のjavascriptアセットフォルダーには、custom.jsjavascriptをダンプする場所という名前のファイルがあります。

私が持っているそのファイルに

var colors = ["red", "blue", "green", "yellow", "brown", "black"];

$('#search').typeahead({source: colors});

ビューを開くと、ブートストラップがtypeahead機能するテキストフィールドが表示されます。

しかし、静的配列を使用して値を検索したくありません。データベース列にアクセスし、その列からすべての値を検索し (これらの値はすべて一意です)、理想的には付随する ID を入力に提供します。分野。それで私はグーグルで離れて、残念ながら同時に初めてJavaScriptを理解しようとしました。

この質問、または非常によく似た質問は、ここで数十回尋ねられましたが、どういうわけか、それらのどれも私のコードを機能させませんでした。

いくつかの回答でこのスクリプトが提案されましたが、コードをコピーしbootstrap-typeahead.jsてファイルから通常どおり動作するjsとして保存すると、動作custom.jsが停止します(間違っていますか?)。

だから私が試したのは、ブートストラップサイトで提案されている最小限の作業ソリューションでした。私が試しているコードはこれですcustom.js

$('#search').typeahead({
    source: function (query, process) {
        $.get('sources', { query: query }, function (data) {
            return process(JSON.parse(data));
        });
    }
});

コントローラのアクションは次のようになります

  def index
    if params[:query]
      @sources = Source.find(:all, :conditions => ['name LIKE ?', "%#{params[:query]}%"])
    else
      @sources = Source.all
    end

    respond_to do |format|  
      format.html # index.html.erb
      format.json { render json: @sources }
    end
  end

ですから、ここで私は現在の理解能力の限界に達しているのかもしれません。ビューをレンダリングして入力フィールドに入力すると、コンソールが表示されます

Started GET "/sources?query=s" for 127.0.0.1 at 2013-05-06 12:30:10 +0000
Processing by SourcesController#index as */*
  Parameters: {"query"=>"s"}
  Source Load (0.9ms)  SELECT "sources".* FROM "sources" WHERE (name LIKE '%s%')
  Rendered sources/index.html.erb within layouts/application (0.2ms)
  Rendered layouts/_shim.html.erb (0.1ms)
  Rendered layouts/_header.html.erb (2.8ms)
Completed 200 OK in 194ms (Views: 189.8ms | ActiveRecord: 0.9ms)

私の関数は正しいアクションと正しいクエリを呼び出しています...しかし、それは何かを返しますか? 入力フィールドには何も表示されません (名前列に値 KG-01 を持つレコードが 1 つあります)。関数の json 出力が何であるかを確認するにはどうすればよいですか? ここでどこが間違っていますか？

4

1 に答える 1