質問編集履歴
2
書式の改善
test
CHANGED
File without changes
|
test
CHANGED
@@ -104,7 +104,7 @@
|
|
104
104
|
|
105
105
|
|
106
106
|
|
107
|
-
**タスクを移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換えさせるようにデーターベースに保存させるにはどのような処理を行っていけば良いのでしょうか?**
|
107
|
+
**タスクを移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換えさせるようにデーターベースに保存させるにはどのようなコードで処理を行っていけば良いのでしょうか?**
|
108
108
|
|
109
109
|
|
110
110
|
|
1
書式の改善
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
sortableを利用し
|
1
|
+
sortableを利用してデータリスト間のデータ移動を行った際の保存のやり方がわからない
|
test
CHANGED
@@ -6,11 +6,11 @@
|
|
6
6
|
|
7
7
|
|
8
8
|
|
9
|
-
現在、trelloのようなタスク管理アプリを作成していますが、他のタスクリストにタスクを移動した際の
|
9
|
+
現在、trelloのようなタスク管理アプリを作成していますが、他のタスクリストにタスクを移動した際に、そのタスクがどのタスクリストに属しているのかという情報を保存することができなくて困っています。
|
10
10
|
|
11
11
|
|
12
12
|
|
13
|
-
タスクリストカードの中に複数のタスクが入れられる仕様になっており、jQuery UIのsortableを使ってカードの移動自体は問題なく動作しています。
|
13
|
+
複数のタスクリストカードの中に複数のタスクが入れられる仕様になっており、jQuery UIのsortableを使ってカードの移動自体は問題なく動作しています。
|
14
14
|
|
15
15
|
また、それぞれのタスクはconnectWithオプションを使って他のタスクリストに移動できるようになっています。
|
16
16
|
|
@@ -92,168 +92,20 @@
|
|
92
92
|
|
93
93
|
|
94
94
|
|
95
|
-
|
95
|
+
最初はタスク移動後に親要素のタスクリストidを引っ張ってきて更新すればいいのではないか?と考えたのですが、jQueryUIのsortableでは動かす前のタスクの情報を持ってくることはできても移動後の情報が取得できないような気がしましたので、
|
96
96
|
|
97
97
|
|
98
98
|
|
99
|
-
|
99
|
+
移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換える処理をさせれば良いのではないかと考えました。(多少処理は重くなるかもしれませんが・・・)
|
100
|
-
|
101
|
-
→ ui.itemの中に移動前のタスクのデータが入っているのはわかったが、タスク移動後の情報を取得する方法がわからない
|
102
100
|
|
103
101
|
|
104
102
|
|
105
|
-
|
103
|
+
しかし、そもそもそのやり方自体がイマイチわからないといった状態です。
|
106
|
-
|
107
|
-
→ タスクリスト全体に処理が入るのでサーバーに無駄な負荷がかかることになるので非現実的?そもそもどう記述したら良いのかよくわからない
|
108
104
|
|
109
105
|
|
110
106
|
|
111
|
-
|
107
|
+
**タスクを移動後にタスクリスト全体に対して、子要素のタスクのtasklist_idを書き換えさせるようにデーターベースに保存させるにはどのような処理を行っていけば良いのでしょうか?**
|
112
108
|
|
113
109
|
|
114
110
|
|
115
|
-
|
116
|
-
|
117
|
-
### 現在のソースコード
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
```jQuery
|
122
|
-
|
123
|
-
$( '.sortable' ) . sortable({
|
124
|
-
|
125
|
-
connectWith: '.sortable',
|
126
|
-
|
127
|
-
cursor: 'grabbing',
|
128
|
-
|
129
|
-
placeholder: 'sortable-placeholder',
|
130
|
-
|
131
|
-
forcePlaceholderSize: 'true',
|
132
|
-
|
133
|
-
distance: '0.1',
|
134
|
-
|
135
|
-
tolerance: 'pointer',
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
update: function(e, ui){
|
140
|
-
|
141
|
-
let item = ui.item;
|
142
|
-
|
143
|
-
let item_data = item.data();
|
144
|
-
|
145
|
-
let params = { row_order_position: item.index() };
|
146
|
-
|
147
|
-
$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
|
148
|
-
|
149
|
-
var token = $('meta[name="csrf-token"]').attr('content');
|
150
|
-
|
151
|
-
|
111
|
+
自分でもイマイチ頭の中が整理されていないので、上手く伝えられているか不安な部分はありますが、ご教授いただけたらと思います。
|
152
|
-
|
153
|
-
});
|
154
|
-
|
155
|
-
$.ajax({
|
156
|
-
|
157
|
-
type: 'put',
|
158
|
-
|
159
|
-
url: item_data.update_url,
|
160
|
-
|
161
|
-
dataType: 'json',
|
162
|
-
|
163
|
-
data: params
|
164
|
-
|
165
|
-
});
|
166
|
-
|
167
|
-
},
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
});
|
174
|
-
|
175
|
-
$( '.sortable' ) . disableSelection();
|
176
|
-
|
177
|
-
});
|
178
|
-
|
179
|
-
```
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
```rails
|
184
|
-
|
185
|
-
class TasksController < ApplicationController
|
186
|
-
|
187
|
-
def update
|
188
|
-
|
189
|
-
Task.update(task_params)
|
190
|
-
|
191
|
-
head :no_content
|
192
|
-
|
193
|
-
end
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
def sort
|
198
|
-
|
199
|
-
tasks = Task.find(params[:task_id])
|
200
|
-
|
201
|
-
tasks.update(task_params)
|
202
|
-
|
203
|
-
head :no_content
|
204
|
-
|
205
|
-
end
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
private
|
210
|
-
|
211
|
-
def task_params
|
212
|
-
|
213
|
-
params.permit(:id, :row_order_position)
|
214
|
-
|
215
|
-
end
|
216
|
-
|
217
|
-
end
|
218
|
-
|
219
|
-
```
|
220
|
-
|
221
|
-
```haml
|
222
|
-
|
223
|
-
%ul.sortable-tasklist.sortable-tasklist-parent
|
224
|
-
|
225
|
-
- if @tasklists.present?
|
226
|
-
|
227
|
-
- @tasklists.each do |tasklist|
|
228
|
-
|
229
|
-
%li.sortable-tasklist-child{ "data-update_url": "#{tasklist_sort_path(tasklist.id)}"}
|
230
|
-
|
231
|
-
.task-bottom__task-list
|
232
|
-
|
233
|
-
.task-bottom__task-list--task-title
|
234
|
-
|
235
|
-
= tasklist.name
|
236
|
-
|
237
|
-
.task-bottom__task-list--tasks
|
238
|
-
|
239
|
-
%ul.sortable.sortable-task-parent
|
240
|
-
|
241
|
-
- if tasklist.tasks.present?
|
242
|
-
|
243
|
-
- tasklist.tasks.rank(:row_order).each do |task|
|
244
|
-
|
245
|
-
%li.sortable-task-child{ "data-update_url": "#{task_sort_path(task.id)}"}
|
246
|
-
|
247
|
-
.task-bottom__task-list--tasks--task
|
248
|
-
|
249
|
-
= task.text
|
250
|
-
|
251
|
-
```
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
### 補足情報(FW/ツールのバージョンなど)
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
ここにより詳細な情報を記載してください。
|