Question

我有一个有嵌套字段的rails 4应用程序，我正在努力让jQuery可以对产品进行排序。

这是我的代码：

<div class="form-group" id='products'>
   <%= f.fields_for :products do |builder| %>
      <%= render 'product_fields', f: builder %>
   <% end %>
</div>

和我的product_fields部分看起来像：

<div class='product'>
   test
</div>

我的jQuery看起来像：

$('#products').sortable({
   items: ".product"
});
$('form').on('click', '.add_fields', function(e) {
   var regexp, time;
   time = new Date().getTime();
   regexp = new RegExp($(this).data('id'), 'g');
   $(this).before($(this).data('fields').replace(regexp, time));

   return e.preventDefault();
});

基本上，正在发生的事情是我在页面上加载了一个.product（通过Rails）。然后，当您单击一个按钮时，我会生成一些生成相同.product div的jQuery。但只有第一个.product（由Rails服务器端创建的那个）是唯一可以排序的。

Answer 1

每次添加一个新的.product时初始化可排序，以便它获取新的添加..这无论如何都是有意义的，因为你不需要对最初的单个.product进行排序

...后

$(this).before($(this).data('fields').replace(regexp, time));

放..

$('#products').sortable({
  items: ".product"
});

或..

$('#products').sortable('refresh');

Jquery可以对动态创建的div进行排序

1 个答案: