質問編集履歴
2
書式の改善
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -51,6 +51,6 @@
|
|
|
51
51
|
|
|
52
52
|
しかし、そもそもそのやり方自体がイマイチわからないといった状態です。
|
|
53
53
|
|
|
54
|
-
**タスクを移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換えさせるようにデーターベースに保存させるにはどのような処理を行っていけば良いのでしょうか？**
|
|
54
|
+
**タスクを移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換えさせるようにデーターベースに保存させるにはどのようなコードで処理を行っていけば良いのでしょうか？**
|
|
55
55
|
|
|
56
56
|
自分でもイマイチ頭の中が整理されていないので、上手く伝えられているか不安な部分はありますが、ご教授いただけたらと思います。
|
1
書式の改善
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
sortableを利用し
|
|
1
|
+
sortableを利用してデータリスト間のデータ移動を行った際の保存のやり方がわからない
|
body
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
使用言語：haml、jQuery、rails
|
|
4
4
|
|
|
5
|
-
現在、trelloのようなタスク管理アプリを作成していますが、他のタスクリストにタスクを移動した際の
|
|
5
|
+
現在、trelloのようなタスク管理アプリを作成していますが、他のタスクリストにタスクを移動した際に、そのタスクがどのタスクリストに属しているのかという情報を保存することができなくて困っています。
|
|
6
6
|
|
|
7
|
-
タスクリストカードの中に複数のタスクが入れられる仕様になっており、jQuery UIのsortableを使ってカードの移動自体は問題なく動作しています。
|
|
7
|
+
複数のタスクリストカードの中に複数のタスクが入れられる仕様になっており、jQuery UIのsortableを使ってカードの移動自体は問題なく動作しています。
|
|
8
8
|
また、それぞれのタスクはconnectWithオプションを使って他のタスクリストに移動できるようになっています。
|
|
9
9
|
ranked_modelを使用して一つのタスクリスト内でのタスクの順番は保存できるようになったのですが、他のタスクリストに移動した際の順番の保存ができません。
|
|
10
10
|
|
|
@@ -45,86 +45,12 @@
|
|
|
45
45
|
|
|
46
46
|
タスク３がタスクリスト2に属しているというデータが保存されないような状況です。
|
|
47
47
|
|
|
48
|
-
|
|
48
|
+
最初はタスク移動後に親要素のタスクリストidを引っ張ってきて更新すればいいのではないか？と考えたのですが、jQueryUIのsortableでは動かす前のタスクの情報を持ってくることはできても移動後の情報が取得できないような気がしましたので、
|
|
49
49
|
|
|
50
|
-
|
|
50
|
+
移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換える処理をさせれば良いのではないかと考えました。（多少処理は重くなるかもしれませんが・・・）
|
|
51
|
-
→ ui.itemの中に移動前のタスクのデータが入っているのはわかったが、タスク移動後の情報を取得する方法がわからない
|
|
52
51
|
|
|
53
|
-
|
|
52
|
+
しかし、そもそもそのやり方自体がイマイチわからないといった状態です。
|
|
54
|
-
→ タスクリスト全体に処理が入るのでサーバーに無駄な負荷がかかることになるので非現実的？そもそもどう記述したら良いのかよくわからない
|
|
55
53
|
|
|
56
|
-
|
|
54
|
+
**タスクを移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換えさせるようにデーターベースに保存させるにはどのような処理を行っていけば良いのでしょうか？**
|
|
57
55
|
|
|
58
|
-
|
|
59
|
-
### 現在のソースコード
|
|
60
|
-
|
|
61
|
-
```jQuery
|
|
62
|
-
$( '.sortable' ) . sortable({
|
|
63
|
-
connectWith: '.sortable',
|
|
64
|
-
cursor: 'grabbing',
|
|
65
|
-
placeholder: 'sortable-placeholder',
|
|
66
|
-
forcePlaceholderSize: 'true',
|
|
67
|
-
distance: '0.1',
|
|
68
|
-
tolerance: 'pointer',
|
|
69
|
-
|
|
70
|
-
update: function(e, ui){
|
|
71
|
-
let item = ui.item;
|
|
72
|
-
let item_data = item.data();
|
|
73
|
-
let params = { row_order_position: item.index() };
|
|
74
|
-
$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
|
|
75
|
-
var token = $('meta[name="csrf-token"]').attr('content');
|
|
76
|
-
|
|
56
|
+
自分でもイマイチ頭の中が整理されていないので、上手く伝えられているか不安な部分はありますが、ご教授いただけたらと思います。
|
|
77
|
-
});
|
|
78
|
-
$.ajax({
|
|
79
|
-
type: 'put',
|
|
80
|
-
url: item_data.update_url,
|
|
81
|
-
dataType: 'json',
|
|
82
|
-
data: params
|
|
83
|
-
});
|
|
84
|
-
},
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
});
|
|
88
|
-
$( '.sortable' ) . disableSelection();
|
|
89
|
-
});
|
|
90
|
-
```
|
|
91
|
-
|
|
92
|
-
```rails
|
|
93
|
-
class TasksController < ApplicationController
|
|
94
|
-
def update
|
|
95
|
-
Task.update(task_params)
|
|
96
|
-
head :no_content
|
|
97
|
-
end
|
|
98
|
-
|
|
99
|
-
def sort
|
|
100
|
-
tasks = Task.find(params[:task_id])
|
|
101
|
-
tasks.update(task_params)
|
|
102
|
-
head :no_content
|
|
103
|
-
end
|
|
104
|
-
|
|
105
|
-
private
|
|
106
|
-
def task_params
|
|
107
|
-
params.permit(:id, :row_order_position)
|
|
108
|
-
end
|
|
109
|
-
end
|
|
110
|
-
```
|
|
111
|
-
```haml
|
|
112
|
-
%ul.sortable-tasklist.sortable-tasklist-parent
|
|
113
|
-
- if @tasklists.present?
|
|
114
|
-
- @tasklists.each do |tasklist|
|
|
115
|
-
%li.sortable-tasklist-child{ "data-update_url": "#{tasklist_sort_path(tasklist.id)}"}
|
|
116
|
-
.task-bottom__task-list
|
|
117
|
-
.task-bottom__task-list--task-title
|
|
118
|
-
= tasklist.name
|
|
119
|
-
.task-bottom__task-list--tasks
|
|
120
|
-
%ul.sortable.sortable-task-parent
|
|
121
|
-
- if tasklist.tasks.present?
|
|
122
|
-
- tasklist.tasks.rank(:row_order).each do |task|
|
|
123
|
-
%li.sortable-task-child{ "data-update_url": "#{task_sort_path(task.id)}"}
|
|
124
|
-
.task-bottom__task-list--tasks--task
|
|
125
|
-
= task.text
|
|
126
|
-
```
|
|
127
|
-
|
|
128
|
-
### 補足情報（FW/ツールのバージョンなど）
|
|
129
|
-
|
|
130
|
-
ここにより詳細な情報を記載してください。
|