Question

I’m trying to implement a sortable list feature based off this example – http://railscasts.com/episodes/147-sortable-lists-revised .

The problem is that when I drop my element, i keep getting this error message:

Started POST "/applications/sort" for 127.0.0.1 at 2012-12-04 11:14:45 -0600
Processing by ApplicationsController#sort as */*
  Parameters: {"application_application_field_attributes_0"=>["id"], "application_application_field_attributes_1"=>["id"], "application_application_field_attributes_2"=>["id"]}
Completed 500 Internal Server Error in 1ms

NoMethodError (undefined method `each_with_index' for nil:NilClass):
  app/controllers/applications_controller.rb:91:in `sort'

views/applications/_form.html.erb

<%= form_for(@application, :class => "main") do |f| %>
...
<div class="sortable" data-update-url="<%= sort_applications_url %>">
    <%= f.fields_for :application_field do |fields| %>
        <%= render 'application_field_fields', f: fields %>  
    <% end %>
</div>
<% end %>

views/applications/_application_field_fields.html.erb

<div class="formRow" id="<%= f.object.position %>">
    <div class="grid2"><%= f.label :field_name %></div>
    <div class="grid3"><%= f.text_field :field_name %></div>
    <div class="grid2"><%= f.label :field_type %></div>
    <div class="grid3"><%= f.text_field :field_type %></div>
    <!-- Need to store the hidden field _destroy here so we can access it via jQuery -->
    <%= f.hidden_field :_destroy %>
    <div class="grid2" align="center"><%= link_to "Remove", '#', class: "remove_fields"%></div>
    <div class="clear"></div>
</div>

applications.js

$('.sortable').sortable({ 
    placeholder: "ui-state-highlight",
    forcePlaceholderSize: true,
    start: function(event, ui) {
        ui.item.addClass('dragging');
    },
    stop: function(event, ui) {
        ui.item.removeClass('dragging');
    },
    update: function(event, ui) {
        $.post($(this).data('update-url'), $(this).sortable('serialize'));
    }
});

controllers/applications#sort

# POST /applications/sort
  def sort
    puts '*********'
    puts '#####'
    puts 'params = ' #{params}
    puts '********'
    params[:application].each_with_index do |id, index| 
        Application.update_all({position: index+1}, {id: id})
    end
    render :nothing => true
  end

When i drop a sortable element, you can see that my params hash is empty. Why is that and how can i fix it?

EDIT

I’ll post my models so you can see the relationships

class Application < ActiveRecord::Base
    belongs_to :company
    has_many :application_field, :order => "position"
    accepts_nested_attributes_for :application_field, :allow_destroy => true
    attr_accessible :application_name, :application_field_attributes
end
class ApplicationField < ActiveRecord::Base
    belongs_to :application
    has_many :application_fields_value
    attr_accessible :field_name, :field_type, :field_value, :application_field_values_attributes
    accepts_nested_attributes_for :application_fields_value, :allow_destroy => true
end

Answer 1

I solved this by changing

<div class="formRow" id="<%= f.object.position %>">
    <div class="grid2"><%= f.label :field_name %></div>
    <div class="grid3"><%= f.text_field :field_name %></div>
    <div class="grid2"><%= f.label :field_type %></div>
    <div class="grid3"><%= f.text_field :field_type %></div>
    <!-- Need to store the hidden field _destroy here so we can access it via jQuery -->
    <%= f.hidden_field :_destroy %>
    <div class="grid2" align="center"><%= link_to "Remove", '#', class: "remove_fields"%></div>
    <div class="clear"></div>
</div>

to

<%= content_tag_for :div, f.object, :class => "formRow" do %>
    <div class="grid2"><%= f.label :field_name %></div>
    <div class="grid3"><%= f.text_field :field_name %></div>
    <div class="grid2"><%= f.label :field_type %></div>
    <div class="grid3"><%= f.text_field :field_type %></div>
    <!-- Need to store the hidden field _destroy here so we can access it via jQuery -->
    <%= f.hidden_field :_destroy %>
    <div class="grid2" align="center"><%= link_to "Remove", '#', class: "remove_fields"%></div>
    <div class="clear"></div>
<% end %>

Can someone explain why this works?