2017-06-19 166 views
1

我檢查了這個question on SO,因爲我有一個與rails類似的問題。 我試圖讓AJAX請求工作(尋找一些金融行情),我認爲我很確定我的代碼(至少我希望如此),但我仍然得到這個奇怪的錯誤:

bootstrap.self-fdc98dee79ee88255e10cac6caa91338165cb76cf0d263744d8d90011fc2ef8f.js:3 Uncaught TypeError: $(...).popover is not a function at HTMLDocument. (bootstrap.self-fdc98dee79ee88255e10cac6caa91338165cb76cf0d263744d8d90011fc2ef8f.js:3) at fire (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js:3233) at Object.fireWith [as resolveWith] (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js:3363) at Function.ready (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js:3583) at HTMLDocument.completed (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js:3618)

這裏是我的腳本:

var init_stock_lookup; 

init_stock_lookup = function() { 
    $('#stock-lookup-form').on('ajax:success', function(event, data, status) { 
    $('#stock-lookup').replaceWith(data); 
    init_stock_lookup(); 
    }) 
} 

$(document).ready(function() { 
    init_stock_lookup(); 
}) 

這裏的頁面:

寶石文件:

source 'https://rubygems.org' 

git_source(:github) do |repo_name| 
    repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/") 
    "https://github.com/#{repo_name}.git" 
end 


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails', '~> 5.1.1' 
gem 'devise' 
gem 'twitter-bootstrap-rails' 
gem 'devise-bootstrap-views' 
gem 'sprockets-rails', :require => 'sprockets/railtie' 
gem 'jquery-rails' 
gem 'jquery-turbolinks', '~> 2.1' 
gem 'stock_quote' 
# Use Puma as the app server 
gem 'puma', '~> 3.7' 
# Use SCSS for stylesheets 
gem 'sass-rails', '~> 5.0' 
# Use Uglifier as compressor for JavaScript assets 
gem 'uglifier', '>= 1.3.0' 
# See https://github.com/rails/execjs#readme for more supported runtimes 
# gem 'therubyracer', platforms: :ruby 

# Use CoffeeScript for .coffee assets and views 
gem 'coffee-rails', '~> 4.2' 
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks 
gem 'turbolinks', '~> 5' 
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder 
gem 'jbuilder', '~> 2.5' 
# Use Redis adapter to run Action Cable in production 
# gem 'redis', '~> 3.0' 
# Use ActiveModel has_secure_password 
# gem 'bcrypt', '~> 3.1.7' 

# Use Capistrano for deployment 
# gem 'capistrano-rails', group: :development 

group :development, :test do 
    gem 'sqlite3' 
    # Call 'byebug' anywhere in the code to stop execution and get a debugger console 
    gem 'byebug', platforms: [:mri, :mingw, :x64_mingw] 
    # Adds support for Capybara system testing and selenium driver 
    gem 'capybara', '~> 2.13' 
    gem 'selenium-webdriver' 
end 

group :development do 
    # Access an IRB console on exception pages or by using <%= console %> anywhere in the code. 
    gem 'web-console', '>= 3.3.0' 
    gem 'listen', '>= 3.0.5', '< 3.2' 
    # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring 
    gem 'spring' 
    gem 'spring-watcher-listen', '~> 2.0.0' 
end 

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem 
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby] 

group :production do 
    gem 'pg' 
    gem 'rails_12factor' 
end 

和鏈接到我的GitHub庫:https://github.com/Ardzii/finance-tracker

我使用的是回報率和自舉(微博)。 我從我之前提供的SO鏈接瞭解到,我有jQuery衝突,但我不知道在哪裏,最重要的是,如何解決它...

感謝您照常爲您的幫助傢伙!

------編輯。 ----------- 這裏是我的application.js參考(我添加了// require twitter/bootstrap行,感謝Hieu的回答)。

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's 
// vendor/assets/javascripts directory can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. JavaScript code in this file should be added after the last require_* statement. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
//= require rails-ujs 
//= require twitter/bootstrap 
//= require jquery 
//= require jquery_ujs 
//= require turbolinks 
//= require_tree . 

回答

4

您必須添加//= require twitter/bootstrap到您application.js

... 
//= require rails-ujs 
//= require jquery 
//= require jquery_ujs 
//= require twitter/bootstrap 
//= require turbolinks 
//= require_tree . 
... 

它在這裏:https://github.com/seyhunak/twitter-bootstrap-rails#using-javascript

+0

嘿總管Hieu!非常感謝你的幫助!但是,您的解決方案並未完全解決問題。現在我得到一個額外的錯誤:'未捕獲的ReferenceError:未定義jQuery','未捕獲的TypeError:$(...)。popover不是函數'仍然存在。現在我可以通過刪除我的application.js中的以下行來使後者消失:'// = require jquery // = require jquery_ujs',但然後出現其他錯誤(顯然,jQuery沒有正確包含)。有任何想法嗎? – Ardzii

+1

嗨@Ardzii你是否需要jQuery後添加該行,它應該是這樣的: ''// = require jquery_ujs // =需要twitter/bootstrap' –

+0

嗨,再次Hieu!謝謝你是最棒的!它似乎工作,雖然我似乎有進一步渲染問題是無關的。我現在將努力:)。再次感謝! – Ardzii

相關問題