1 つのモデルを使用した jQuery の並べ替えの例を数多く見てきましたが、2 つのモデルで役立つものはまだ見つかりません。とは言うものの...
フォルダーとタスクの 2 つのモデルがあります。
何が機能するかは次のとおりです。フォルダー内に含まれるタスクを並べ替えることができます。
ここに私が望むものがあります:タスクをあるフォルダーから別のフォルダーにドロップし、新しいフォルダーのタスクが正しくソートされるようにする機能があります(つまり、タスク#1とタスク#3の間でドラッグすると、新しいタスクがソートされますタスク #2 として)。誰でもこれを行う方法について支援を提供できますか?
これが私がこれまでに持っているものです:
フォルダー/index.html.erb....
<ul id="folder">
<% @folders.each_with_index do |folder, i| %>
<li id="folder_<%= folder.id %>"> <%= folder.name %> </li>
<% if !folder.tasks.blank? %>
<ul id="task">
<% folder.tasks.each do |task| %>
<li id="task_<%= task.id %>"><%= task.name %></li>
<% end %>
</ul>
<% end %>
<% end %>
</ul>
<script type="text/javascript">
// Sorting the list
$(document).ready(function(){
$(function() {
$('#task').sortable(
{
opacity: 0.6,
cursor: 'move',
connectWith: '#folder',
receive: function(event, ui) {
$.ajax({
type: 'put',
data: {folder_id : '#{folder.id}' },
dataType: 'script',
complete: function(request){
$('#task').effect('highlight');
}, url: '/tasks/change_folder'
})
},
update: function(){
$.ajax({
type: 'post',
data: $('#task').sortable('serialize') ,
dataType: 'script',
complete: function(request){
$('#task').effect('highlight');
},
url: '/tasks/sort'
})
}
});
});
});