我有两个 div id=left 和 div id=right。现在,左侧 div 中列出了多个带有项目的复选框。当我选中一个复选框时,该项目应从左侧 div 中删除并添加到右侧 div,并将所选项目从 div id=right 移动到 div id=left。当我单击一个复选框时,它的状态也在数据库中更新。所以告诉我如何在 rails 3 中使用 jquery-ajax 执行此任务。
脚本 :
<script>
$(function () {
$(".checkbox").click(function() {
$('.allchkb').each(function(){
var item = $(this).attr('id');
if($(this).is(':checked')){
$("#right > span."+item).appendTo("#left");
$(this).siblings("#left").css("text-decoration","line-through");
$(this).siblings("#left").css("color","#aaa");
$(this).parent('li').css("background-color","#ccc");
}
else
{
$("#left > span."+item).appendTo("#right");
}
});
});
});
</script>
导轨代码:
<div class="box-body box-body-nopadding" id="left">
<% @activity.each do |p| %>
<% p.task.each do |t| %>
<ul class="tasklist">
<li class="bookmarked">
<label class="checkbox">
<%= check_box_tag 'activity_status', task.id, :class => 'checkbox'%>
<%= link_to task.title, mytask_path(@task), :title => "is responsible. , Total my task : " %>
<span class="task-actions">
<%= link_to "Edit", task(@activity) %> |
<%= link_to "delete", @task, :method => :delete %>
</span>
<span class="task-actions">
<%= task.due_date %>
</span>
</li><li>
</li>
</ul>
<% end %>
<% end %>
</div>
<div class="box-body box-body-nopadding" id="right">
</div>