如何在轨道上制作物品可以排序

时间:2014-10-03 15:56:48

标签: javascript ruby-on-rails-4

使用Rails 4和Ruby 1.9.3。样式由基于bootstrap 3的内部开发的gem处理。

我一直在寻找答案,并找到了一些不同的例子,展示了如何使用视图中的基本列表来完成此操作。 railscast就是我看过的一个例子。

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

但是,我试图使用部分但没有成功的rails嵌套形式实现这一点。可悲的是,我是ruby,rails的新手,并且没有javascript的先验知识所以这是一个步骤学习曲线。

我的服务模式涉及通过服务场所的场所模型。 service_places.position字段保存停靠点的顺序。

我的服务嵌套表单(_form.html.erb)如下所示:

<!-- Adds the Service_Places (stops) associations via partial (sort applied in model) -->
<div>
  <div class="links" id="sortable">
    <%= link_to_add_association 'Add Stop', f, :service_places, :class => "btn btn-default", :data => {"association-insertion-method" => "after" } %>
  </div>
  <%= f.fields_for :service_places do |service_places| %>
    <%= render 'service_place_fields', :f => service_places %>
  <% end %>
</div>

我的service_place部分如下所示:

<!-- This will hold the partial form for service places -->
<div class="nested-fields">
  <%= f.label :service_place, "Stops", :class=>"col-sm-2 control-label" %>
  <div class="col-sm-1">
    <%= f.text_field :position, :class=> "form-control", :placeholder => "Position" %>
  </div>  
  <div  class="col-sm-3">
    <%= f.collection_select :place_id, Place.where('active = true').order(:place_name), :id, :place_name, :prompt => "Select Place" %>
  </div>
  <div>
    <%= link_to_remove_association "Remove Stop", f, :class => "btn btn-default" %>
  </div>
</div>

我开始尝试为每个service_place partials DIV标记分配一个ID,但无法使其工作。

我想知道的问题是:

1)是否可以允许用户重新排序表单中的项目?并将新订单保存在服务器中?

2)如果有可能,有人可以给我一个关于如何做到这一点的提示。

提前感谢您花时间看这篇文章。

1 个答案:

答案 0 :(得分:1)

我的同事向我展示了使用&#34;作为列表&#34;来实现这一目标的方法。宝石。
他的博客可以在这里找到:

http://nicholshayes.co.uk/blog/?p=344

为了实现这一目标,我做了如下所示的修改。

1)在我的服务模型中,我添加了以下三种方法:

  # Used in the positioning of service places using the acts_as_list gem
  def method_missing(symbol, *args, &block)
    if acts_as_list_method?(symbol)
      pass_method_to_service_service_place(symbol, args.first)
    else
      super
    end
  end

  # Used in the positioning of service places using the acts_as_list gem
  def pass_method_to_service_service_place(symbol, service_place)
    raise "A Service_Place is needed for re-ordering places" unless service_place.kind_of? ServicePlace
    service_place.send(symbol) if service_place
  end

  # Used in the positioning of service places using the acts_as_list gem
  def acts_as_list_method?(symbol)
    ActiveRecord::Acts::List::InstanceMethods.instance_methods.include?(symbol.to_sym)
  end

2)添加路线

  resources :services, :concerns => :paginatable, only: [:create, :destroy, :edit, :index, :new, :show, :update] do

    # Required for the re-ordering of the routes
    resources :service_places do
      member do
        get :move_up
        get :move_down
      end
    end

  end

3)修改SERVICE show.html

<% @service.service_places.reorder("service_places.position asc").each do |serviceplace| %>

  <dd>

    <% if user_signed_in? %>
      <% if @service.first?(serviceplace) %>
        <%= link_to('', move_up_service_service_place_path(serviceplace, service_id: @service), class: "btn btn-default btn-xs glyphicon glyphicon-arrow-up invisible") %>
      <% else %>
        <%= link_to('', move_up_service_service_place_path(serviceplace, service_id: @service), class: "btn btn-default btn-xs glyphicon glyphicon-arrow-up") %>
      <% end %>

      <% if @service.last?(serviceplace) %>
        <%= link_to('', move_down_service_service_place_path(serviceplace, service_id: @service), class: "btn btn-default btn-xs glyphicon glyphicon-arrow-down invisible") %>
      <% else %>
        <%= link_to('', move_down_service_service_place_path(serviceplace, service_id: @service), class: "btn btn-default btn-xs glyphicon glyphicon-arrow-down") %>
      <% end %>
    <% end %>

    <!-- Unfortunately this is not very efficient way of showing the place because it calls the db for each item. -->
    <%= Place.find(serviceplace.place_id).place_name %>

  </dd>

<% end %>