在我的用户/索引 View 中保存无序列表
<ul id="documents" data-update-url="<%= sort_documents_url %>">
<% @documents.each do |document| %>
<%= content_tag_for :li, document do %>
<span class="handle">[drag]</span>
<%= link_to h(document.title), document %>
<%= link_to 'Delete', document, method: :delete, remote: true %>
<% end %>
<% end %>
</ul>
正如您在 ul 中看到的那样,我正在为每个模型渲染部分内容。 _documents.html.erb 部分 渲染 html 的第二次更新。
<ul id="documents" data-update-url="http://localhost:3000/documents/sort">
<li class="document" id="document_4fc4db0cb6231417f300000c">
<span class="handle">[drag]</span>
<a href="/documents/4fc4db0cb6231417f300000c">Help</a>
<a href="/documents/4fc4db0cb6231417f300000c" data-method="delete" data-remote="true" rel="nofollow">Delete</a>
</li> <li class="document" id="document_4fc4db27b6231417f300000f">
<span class="handle">[drag]</span>
<a href="/documents/4fc4db27b6231417f300000f">adam</a>
<a href="/documents/4fc4db27b6231417f300000f" data-method="delete" data-remote="true" rel="nofollow">Delete</a>
</li> <li class="document" id="document_4fc4db2db6231417f3000010">
<span class="handle">[drag]</span>
<a href="/documents/4fc4db2db6231417f3000010">adam</a>
<a href="/documents/4fc4db2db6231417f3000010" data-method="delete" data-remote="true" rel="nofollow">Delete</a>
</li> <li class="document" id="document_4fc4dbaab6231417f3000015">
<span class="handle">[drag]</span>
<a href="/documents/4fc4dbaab6231417f3000015"></a>
<a href="/documents/4fc4dbaab6231417f3000015" data-method="delete" data-remote="true" rel="nofollow">Delete</a>
</li></ul>
document.js.coffee jQuery->
$('#documents').sortable
handle: '.handle'
update: ->
$.post($(this).data('update-url'), $(this).sortable('serialize'))
最佳答案
您不能拥有 <div>
直接下一个<ul>
。我敢打赌这会破坏脚本。
事实上,you cannot have anything other than <li>
inside a <ol>
or <ul>
.
关于javascript - jQuery 可排序问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10798895/