2017-09-18 7 views
0

pluginをバワーでインストールし、bower.jsonファイル:bower install bootstrap-star-rating --saveに組み込みました。ビューでは(これはRailsのプロジェクトです)私は、コードのこの部分を持っている:

<%= form.text_field :rating, 
          id: :review_rating, 
          class: 'form-item large-6 cell', 
          placeholder: 'Rating*', 
          required: true %> 

私のJSはpublic/layoutに一口でコンパイルされ、それがapplication.js中に存在しています。 config/application.rbでは、私は、コードのこの部分を持っている:

config.assets.paths << Rails.root.join('public', 'layout') 

ので、layoutディレクトリは、資産のパイプラインに存在しています。プラグインは依存関係としてbower.jsonに存在する場合、Uncaught TypeError: $(...).rating is not a function: 私は星格付けを初期化するために使用するコードは次のとおりです。

$('#review_rating').rating({ 
     min: 1, 
     max: 5, 
     step: 1, 
     size: 'sm', 
     theme: 'krajee-uni' 
    }); 

は、なぜ私はエラーを取得していますか?

+0

実際のマークアップを確認してください。他のJavascriptプラグインの上にJQueryが存在している必要があります。つまり、まずマークアップでJQuery.min.jsスクリプトを参照する必要があります。 –

答えて

0

エラーをトリガする機能がbootstrap star-rating githubのリポジトリの行498

$.fn.rating = function (option) { 
    var args = Array.apply(null, arguments), retvals = []; 
    args.shift(); 
    this.each(function() { 
     var self = $(this), data = self.data('rating'), options = typeof option === 'object' && option, 
      theme = options.theme || self.data('theme'), lang = options.language || self.data('language') || 'en', 
      thm = {}, loc = {}, opts; 
     if (!data) { 
      if (theme) { 
       thm = $.fn.ratingThemes[theme] || {}; 
      } 
      if (lang !== 'en' && !$h.isEmpty($.fn.ratingLocales[lang])) { 
       loc = $.fn.ratingLocales[lang]; 
      } 
      opts = $.extend(true, {}, $.fn.rating.defaults, thm, $.fn.ratingLocales.en, loc, options, self.data()); 
      data = new Rating(this, opts); 
      self.data('rating', data); 
     } 

     if (typeof option === 'string') { 
      retvals.push(data[option].apply(data, args)); 
     } 
    }); 
    switch (retvals.length) { 
     case 0: 
      return this; 
     case 1: 
      return retvals[0] === undefined ? this : retvals[0]; 
     default: 
      return retvals; 
    } 
}; 

機能はアセットパイプラインに含まれていないで存在します。 star-rating.jsファイルは、ちょうどそのf12とクロムの開発者ツールバーを開き、ソースのセクションでそのファイルを検索し、あなたのページを開き、サーバーrails sを実行してこれをテストするために、あなたのapplication.js

には含まれていません。私はプラグインをインストールするために亭を使用していないと、多分ちょうどあなたのapplication.js.scss内側とのための適切なフォルダ内のすべての関連のjs、cssファイルや画像が含まれるようにenoughtされるのRuby on Railsで

enter image description here

あなたのイメージ。

https://github.com/kartik-v/bootstrap-star-rating

あなたは追加の問題を持っている場合は私に知らせてください。

+0

私はベンダーのディレクトリに適切なjsとcssファイルを置くことに決めましたが、今はすべて正常に動作しています。ありがとう。 –

+0

@AlexZakruzhetskyi素晴らしい! –

関連する問題