jquery-ui, Foundation и Rails 3.1 не играют хорошо вместе

Question

У меня есть приложение Rails 3.1, в котором используется драгоценный камень с основами и рельсами jquery-rails, и все, кажется, работает. Я попытался добавить jquery-ui-rails gem в микс и запустить установку пакета, и все выглядит хорошо. Вот соответствующая часть моей Gemfile:

# Bundle edge Rails instead: 
# gem 'rails',  :git => 'git://github.com/rails/rails.git' 

gem 'sqlite3' 
gem 'mysql2' 
gem 'devise' 
gem 'omniauth' 
gem 'omniauth-facebook', '1.4.0' 
gem 'omniauth-google-oauth2' 
gem 'jquery-rails' 

gem 'json' 

# Gems used only for assets and not required 
# in production environments by default. 
group :assets do 
    gem 'sass-rails', '~> 3.1.4' 
    gem 'coffee-rails', '~> 3.1.1' 
    gem 'uglifier', '>= 1.0.3' 
    gem 'foundation-rails' 
    gem 'jquery-ui-rails' 
end 

Здесь application.js:

//= require jquery 
//= require jquery_ujs 
//= require jquery.ui.all 
//= require foundation 
//= require_tree . 

$(function(){ $(document).foundation(); }); 

Вот application.css:

/* 
* This is a manifest file that'll automatically include all the stylesheets available in this directory 
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at 
* the top of the compiled file, but it's generally better to create a new file per style scope. 
*= require_self 
*= require foundation_and_overrides 

*= require_tree . 
*/ 

/* 
*= require jquery.ui.all 
*/ 

У меня есть страница, которая включает в себя следующие код:

<ul id='sortable_list'> 
     <% @list.items.each do |item| %> 
     <li><%=item.name%></li> 
     <%end%> 
    </ul> 

    </div> 
</div> 

<script> 

    $(function() { 
    $("#sortable_list").sortable(); 
    $("#sortable_list").disableSelection(); 
    }); 
</script> 

Список не сортируется, когда загружается страница, и я получаю сообщение «Uncaught ReferenceError: $ не определено». Я нахожусь в своем уме - помогите, пожалуйста!

Answer 1

ОК, поэтому проблема была в текущей версии Фонда (5.0.2). В документации говорится, что его тег сценария должен быть размещен непосредственно перед закрывающим тегом. Я поместил свой скрипт_tag для application.js и, по-видимому, jQuery нравится загружаться в голову. Поэтому я переместил //= require foundation из приложения.js, переместил <%= javascript_include_tag "application" %> назад в голову и добавил <%= javascript_include_tag "foundation" %> сам по себе в нижней части документа. Я полагаю, что это будет работать, пока они не исправят ошибку в 5.0.2, которая требует, чтобы она была загружена в конце тела.