0

我想稍微關注一下this rails轉換,以使jQuery-fileuploader在帶有carrierwave的rails中工作。我有carrierwave和其他一切正常工作,但是當我嘗試使用jquery-fileupload-rails時,我一直得到相同的錯誤:Uncaught TypeError: Object [object Object] has no method 'fileupload'。當我在控制檯上運行$(selector).fileupload()時,情況也是如此。jQuery-fileupload-rails fileupload在每次嘗試時都是未定義的

的Gemfile:

source 'http://rubygems.org' 

gem 'rails', '3.2.16' 

gem 'mysql2' 
gem 'jquery-rails' 
gem 'rest-client' 
gem 'will_paginate' 
gem 'simple_form' 
gem 'chronic' 
gem 'nokogiri' 

gem 'carrierwave' 

group :assets do 
    gem 'sass-rails' 
    gem 'coffee-rails' 
    gem 'uglifier' 
    gem 'jquery-fileupload-rails' 
end 

應用程序/資產/ Java腳本/ application.js中

//= require jquery 
//= require jquery_ujs 
//= require bootstrap 
//= require bootstrap_ujs 
//= require jquery-fileupload/basic 
//= require_tree . 

當我在上面//= require jquery-fileupload這也恰好。

我檢查了頭,所有腳本加載正確的順序:

<script src="/assets/jquery.js?body=1" type="text/javascript"></script> 
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script> 
<script src="/assets/bootstrap.js?body=1" type="text/javascript"></script> 
<script src="/assets/bootstrap_ujs.js?body=1" type="text/javascript"></script> 
<script src="/assets/jquery-fileupload/vendor/jquery.ui.widget.js?body=1" type="text/javascript"></script> 
<script src="/assets/jquery-fileupload/jquery.iframe-transport.js?body=1" type="text/javascript"></script> 
<script src="/assets/jquery-fileupload/jquery.fileupload.js?body=1" type="text/javascript"></script> 
<script src="/assets/jquery-fileupload/basic.js?body=1" type="text/javascript"></script> 
<script src="/assets/uploads.js?body=1" type="text/javascript"></script> 
<script src="/assets/application.js?body=1" type="text/javascript"></script> 

在分析中,開發者控制檯中的腳本:

  • 腳本 jquery-fileupload/basic.js僅有5空白線...這應該是什麼? This應該是空白文件,因爲它包含的是文件要包含在資產管道中。

  • jquery-fileupload/jquery.fileupload.js劇本充滿了東西,但是當我複製並粘貼整個文件到控制檯和命中進入它輸出:

Object function (selector, context) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init(selector, context, rootjQuery); } has no method 'widget'

我正在捆綁安裝,然後卸載重新安裝gem並重新啓動服務器(多次)。經過5個小時的失敗後,我開始全部嘗試。它失敗了。

UPDATE:

如果我複製粘貼整個jquery-fileupload/vendor/jquery.ui.widget.js文件到控制檯,然後複製粘貼整個jquery-fileupload/jquery.fileupload.js到我沒有得到上面列出的錯誤控制檯和fileuplaod方法是突然調用。這對我來說沒有意義,因爲如果它按照這個順序包含在頭部中,它應該按照這個順序運行,並且在調用$(selector).fileupload()時可用。

回答

0

隨着我的更新,很明顯看到資產未被正確包含。我幾乎是積極的,這將解決時,JavaScript文件都放在一個大文件,他們肯定會按正確的順序執行,因爲他們將被加載在一起。我可以通過手動加載腳本以正確的順序是這樣來解決發展中的環境問題:

jQuery -> 
    $.getScript "/assets/jquery-fileupload/vendor/jquery.ui.widget.js",() -> 
    $.getScript "/assets/jquery-fileupload/jquery.iframe-transport.js",() -> 
     $.getScript "/assets/jquery-fileupload/jquery.fileupload.js",() -> 
     $(selector).fileupload() 

這是非常低效的,因爲它提出了三個請求到服務器之前調用等到前面的腳本加載爲下一個。這應該在生產環境中使用NOT。我不確定如何讓application.js構建出來並用於開發,但我會努力。一旦我可以在生產環境中測試服務器,看看它是否工作正常,我希望我會更新這個答案,並接受它,如果沒有人有更好的答案。

我開始在github上討論這個問題here

+0

'// = require_directory .'? –

+0

應該是'// require_tree .',不是? –

+0

@RichPeck'// = require_tree .'實際上應該是什麼。這應該是對這個問題的評論。這是我試圖解決這個問題時留下的剩餘部分,我刪除了樹形線,並且錯誤地放棄了這一行。感謝您指出了這一點。它以後可能會導致問題。 –

相關問題