0

フォームの自動入力タイプアヘッドに「会社」の名前を渡してほしい。

私はtwitterブートストラップとgongemを使用して、データをJsonに渡し、jsで利用できるようにしています。

ただし、フィールドに応答させることができません。データがフォームで利用できるとは思わず、理由がわかりません。

私の会社のコントローラーは、会社の名前をgon変数に割り当てる次のことを行います。

gon.firms = Firm.all.map &:name

My Application.html.erbのヘッダーには、gon変数をjsで使用できるようにするために次のものがあります。

<%= include_gon %>
<script type="text/javascript">
    jQuery(document).ready(function() {
        $(.typeahead).typeahead({source:gon.firms});
    });
    </script>

次に、typeaheadを割り当てたいフォームがあり、class="typeahead"を割り当てました。

<%= form_tag firms_path, :method => 'get', :class => 'typeahead'  do %>
<%= text_field_tag :search, params[:search], :class => 'input-medium search-query', :placeholder => 'Firm name' %>
<%= submit_tag "Search", :name => nil ,:class => 'btn' %>
<% end %>

最後に、application.jsは、twitterブートストラップのドキュメントに従って関連するjqueryをファイルします。

$(function() {  
    $('.typeahead .input-medium search-query').typeahead({source:[gon.firms]});
}

私のアプリケーション.jsには次のライブラリもあります

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

gon.firmsが変数として使用可能であることを確認しましたが、開発コンソールに次のエラーがあります

uncaught syntax error: Unexpected token

これを引き起こしている可能性のあるアイデアはありますか？

明らかに間違っていることはありますか？

4

2 に答える 2

1

まず、gon.firms期待どおりにデータが入力されていることを確認します（Web開発ツールコンソールで確認してください）。次に、そこにいる間、ボックスに入力するときにjsエラーがないことを確認します。最後に、ドキュメントによると、プラグインをフォームではなくテキストフィールドに添付するようです。

$('.typeahead .search-query').typeahead( { source: gon.firms } );
于 2012-04-14T12:40:56.740 に答える
1
これは gon.firms が js 配列ではなく ruby​​ 配列であるためです。

文字列を js に転送してから、次のように配列に分割できます。 

$(function() {
    var col = "<%= @pon.firms.join(",") %>".split(",");
    $(".search-query").typeahead({ source: col });
});
于 2012-04-25T06:33:11.103 に答える