Gives order to lists through a drag and drop functionality.

.Acts as List for Rails 3 & 4.md

#Acts as List

Resources

https://github.com/swanandp/acts_as_list

http://railscasts.com/episodes/147-sortable-lists

1. bash

rails g migration add_position_to_projects position:integer
rake db:migrate

2. routes.rb

resources :projects do
  collection { post :sort }
end

3. projects_controller.rb

def sort
  params[:project].each_with_index do |id, index|
    Project.update_all(['position=?', index+1], ['id=?', id])
  end
  render :nothing => true
end

4. project.rb

#Acts as Sortable
acts_as_list

# If it belongs to a realationship
  #page.rb
  has_many :questions, :order => "position"
  
  #question.rb
  acts_as_list :scope => :page

5. index.htlm.haml

%tbody#projects{"data-update-url" => sort_projects_url}
- @projects.each do |project|
= content_tag_for :tr, project do
  %td
    %span.handle
      [Drag]
  %td.image 
    = image_tag(project.project_images.first.image(:thumb)) if project.project_images.count > 0
  %td 
    = project.title 
  %td
    = link_to 'Show', project, :class => "btn btn-default btn-xs"
    = link_to 'Edit', edit_project_path(project), :class => "btn btn-warning btn-xs"
    = link_to 'Destroy', project, method: :delete, data: { confirm: 'Are you sure?' }, :class => "btn btn-danger btn-xs"

6. projects.js.coffee

jQuery ->
  $('#projects').sortable
    axis: 'y'
    handle: '.handle'
    update: ->
      $.post($(this).data('update-url'), $(this).sortable('serialize'))

7. style.css

/*** Acts as List ***/
.handle{
	color: gray;
	text-align: center;
}

.handle:hover{
	cursor: move;
}

8. gemfile

gem 'acts_as_list'
gem 'jquery-ui-rails'

#You may need to restart server after you run bundle install

9.application.js

//= require jquery.ui.all