1
를 확인했습니다. 이 순간에 나는 두 개의 항목 만 가지고 있습니다 (각 표에는 하나의 항목이 있습니다).내가이 페이지를
상위 테이블에는 완료되지 않은 작업자에 대한 작업이 포함되어 있으며, 아래쪽 테이블에는 완료된 작업자에 대한 작업이 포함되어 있습니다.
단어 : 예/아니오는 작업이 완료되지 않았 으면 말합니다. 나는 다음 일을하려고하고
: 사용자가 상위 테이블에 하위 테이블에서 항목을 이동
, 나는 '체크 박스가 자동으로 선택되는 (그래서 항상에'예 '로 이동합니다 아니').
이 내 index.html.erb (값이 변경되는 동안 데이터베이스를 업데이트하기 위해 best_in_place 사용)입니다 :
<html>
<body>
<ul id="sortable1" class="connectedSortable">
<% @tasks_worker_todo.each do |task| %>
<li class="ui-state-default">
<%= best_in_place task, :done, :classes => 'highlight_on_success', type: :checkbox, collection: %w[No Yes] %> |
<%= task.admin_mail %> |
<%= task.task %>
</li>
<% end %>
</ul>
<br><br>
<ul id="sortable2" class="connectedSortable">
<% @tasks_worker_done.each do |task| %>
<li class="ui-state-highlight">
<%= best_in_place task, :done,:classes => 'highlight_on_success', type: :checkbox, collection: %w[No Yes] %> |
<%= task.admin_mail %> |
<%= task.task %>
</li>
<% end %>
</ul>
이 내 application.js
$(document).ready(function(){
jQuery('#sortable1, #sortable2')
.sortable(
{'connectWith':'#sortable1',
'dropOnEmpty':true,
'scroll':true,
items: "li:not(.emptyMessage)",
receive: function(event, ui) {
alert('moved');
//hide empty message on receiver
$('li.emptyMessage', this).hide();
//show empty message on sender if applicable
if($('li:not(.emptyMessage)', ui.sender).length == 0){
$('li.emptyMessage', ui.sender).show();
alert('alon');
} else {
$('li.emptyMessage', ui.sender).hide();
}
}
});
});
어떤 도움이 감사합니다!
업데이트 :
<!DOCTYPE html>
<html>
<head>
<title>TODOLIST</title>
<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/admin.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/scaffolds.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/tasksadmins.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/workers.css?body=1" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-ui.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.purr.js?body=1" type="text/javascript"></script>
<script src="/assets/best_in_place.js?body=1" type="text/javascript"></script>
<script src="/assets/admin.js?body=1" type="text/javascript"></script>
<script src="/assets/myjquery.js?body=1" type="text/javascript"></script>
<script src="/assets/tasksadmins.js?body=1" type="text/javascript"></script>
<script src="/assets/workers.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="FZho6dNmNWjn82HB+MzhL/MtIm4s6F7JFiLVysPCREY=" name="csrf-token" />
</head>
<body>
<div id="right">
<li><a href="https://stackoverflow.com/users/sign_out" data-method="delete" rel="nofollow">Sign out</a></li>
</div>
<p id="notice"></p>
<p id="alert"></p>
<center>
<html>
<body>
<ul id="sortable1" class="connectedSortable">
<li class="ui-state-default">
<span class='best_in_place highlight_on_success' id='best_in_place_tasksadmin_1_done' data-url='/tasksadmins/1' data-object='tasksadmin' data-collection='["No","Yes"]' data-attribute='done' data-type='checkbox'>No</span> |
[email protected] |
feed the dog
</li>
</ul>
<br><br>
<ul id="sortable2" class="connectedSortable">
<li class="ui-state-highlight">
<span class='best_in_place highlight_on_success' id='best_in_place_tasksadmin_2_done' data-url='/tasksadmins/2' data-object='tasksadmin' data-collection='["No","Yes"]' data-attribute='done' data-type='checkbox'>Yes</span> |
[email protected] |
feed the fish
</li>
</ul>
</body>
</html>
</center>
</body>
</html>
추신을 :
이 루비가 생성하는 HTML입니다 나는 두 개의 몸과 두 개의 html이 있다는 것을 안다. 나는 내일 주문할 것이다.
무엇 확인란입니까? 게시 라이브 HTML – charlietfl
예, 루비가 생성하는 HTML을 게시 할 수 있습니까? –
예, 기다려주십시오. 둘 다 감사합니다! –