質問編集履歴
8
UserSortedComponent.vue 変更更新しました
test
CHANGED
File without changes
|
test
CHANGED
@@ -122,9 +122,9 @@
|
|
122
122
|
|
123
123
|
<span> 表示順{{ usid + 1}} 【{{user.name}}】</span>
|
124
124
|
|
125
|
-
<input type="hidden" name="userid" v-bind:userid="
|
125
|
+
<input type="hidden" name="userid" v-bind:userid="user.id">
|
126
|
-
|
126
|
+
|
127
|
-
<input type="hidden" name="sortid" v-bind:sortid="
|
127
|
+
<input type="hidden" name="sortid" v-bind:sortid="usid">
|
128
128
|
|
129
129
|
</div>
|
130
130
|
|
7
タイトル変更、補足追加
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
Laravel + Vue.js + vue.draggable 値の
|
1
|
+
Laravel + Vue.js + vue.draggable 値の指定方法がわからない
|
test
CHANGED
@@ -318,6 +318,18 @@
|
|
318
318
|
|
319
319
|
```
|
320
320
|
|
321
|
+
や
|
322
|
+
|
323
|
+
|
324
|
+
|
325
|
+
```
|
326
|
+
|
327
|
+
params.append ('userid', draggable.userid),
|
328
|
+
|
329
|
+
params.append ('sortid', draggable.sort_id),
|
330
|
+
|
331
|
+
```
|
332
|
+
|
321
333
|
としても値が取得できません。
|
322
334
|
|
323
335
|
ChromeプラグインのVueDevToolsで確認したところ、Array[0]となっています。
|
6
初心者マーク
test
CHANGED
File without changes
|
test
CHANGED
@@ -380,4 +380,8 @@
|
|
380
380
|
|
381
381
|
|
382
382
|
|
383
|
+
|
384
|
+
|
385
|
+
|
386
|
+
|
383
387
|
初心者ですが、何卒ご教授願います。
|
5
タイトル変更
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
Laravel + Vue.js + vue.draggable
|
1
|
+
Laravel + Vue.js + vue.draggable 値の取得方法について
|
test
CHANGED
File without changes
|
4
補足情報変更、試したこと追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -226,14 +226,6 @@
|
|
226
226
|
|
227
227
|
}
|
228
228
|
|
229
|
-
},
|
230
|
-
|
231
|
-
mounted() {
|
232
|
-
|
233
|
-
var self = this;
|
234
|
-
|
235
|
-
axios.get('/users/sorted')
|
236
|
-
|
237
229
|
}
|
238
230
|
|
239
231
|
});
|
@@ -372,4 +364,20 @@
|
|
372
364
|
|
373
365
|
|
374
366
|
|
367
|
+
3
|
368
|
+
|
369
|
+
子要素から親要素へ値を渡すことが必要?
|
370
|
+
|
371
|
+
```
|
372
|
+
|
373
|
+
params.append ('userid', this.userid),
|
374
|
+
|
375
|
+
params.append ('sortid', this.sortid),
|
376
|
+
|
377
|
+
```
|
378
|
+
|
379
|
+
thisが効いていない。機能していない。そのため、「空の値は不可」とSQLエラーが返ってくる。
|
380
|
+
|
381
|
+
|
382
|
+
|
375
383
|
初心者ですが、何卒ご教授願います。
|
3
補足情報追加
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
Laravel + vue.draggable 入れ替え後の値を取得したい
|
1
|
+
Laravel + Vue.js + vue.draggable 入れ替え後の値を取得したい
|
test
CHANGED
@@ -6,8 +6,6 @@
|
|
6
6
|
|
7
7
|
- Laravel5.6
|
8
8
|
|
9
|
-
- MySQL5.6
|
10
|
-
|
11
9
|
- Vue.js2.9.6
|
12
10
|
|
13
11
|
|
@@ -52,7 +50,7 @@
|
|
52
50
|
|
53
51
|
|
54
52
|
|
55
|
-
draggableで入れ替えた後に、入れ替え後の値を表示まではできたのですが、その値をinput文に挿入できないでいます。配列の中の値を取得するにはどのようにすればよいのでしょうか。
|
53
|
+
vue.draggableで入れ替えた後に、入れ替え後の値を表示まではできたのですが、その値をinput文に挿入できないでいます。配列の中の値を取得するにはどのようにすればよいのでしょうか。
|
56
54
|
|
57
55
|
|
58
56
|
|
2
補足情報追記(web.php)
test
CHANGED
File without changes
|
test
CHANGED
@@ -250,7 +250,7 @@
|
|
250
250
|
|
251
251
|
//表示画面
|
252
252
|
|
253
|
-
public function userSorted(
|
253
|
+
public function userSorted()
|
254
254
|
|
255
255
|
{
|
256
256
|
|
@@ -258,7 +258,7 @@
|
|
258
258
|
|
259
259
|
|
260
260
|
|
261
|
-
return view('users.sorted', ['user
|
261
|
+
return view('users.sorted', ['users' => $users]);
|
262
262
|
|
263
263
|
}
|
264
264
|
|
@@ -286,6 +286,16 @@
|
|
286
286
|
|
287
287
|
```
|
288
288
|
|
289
|
+
#####web.php
|
290
|
+
|
291
|
+
```
|
292
|
+
|
293
|
+
Route::get('users/sorted', 'UserController@userSorted');//順番入れ替え出力
|
294
|
+
|
295
|
+
Route::post('users/sorted_store', 'UserController@userSortedStore');//更新処理
|
296
|
+
|
297
|
+
```
|
298
|
+
|
289
299
|
### 教えていただきたいところ
|
290
300
|
|
291
301
|
・userid , sortidの値が取得をしたい
|
1
補足説明の追加
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
Laravel + vue.draggable
|
1
|
+
Laravel + vue.draggable 入れ替え後の値を取得したい
|
test
CHANGED
@@ -12,12 +12,6 @@
|
|
12
12
|
|
13
13
|
|
14
14
|
|
15
|
-
【実現したいこと】
|
16
|
-
|
17
|
-
Vue.draggableを使って、入れ替えた順番を送信したい。
|
18
|
-
|
19
|
-
|
20
|
-
|
21
15
|
【データベース】
|
22
16
|
|
23
17
|
**usersテーブル**
|
@@ -58,8 +52,52 @@
|
|
58
52
|
|
59
53
|
|
60
54
|
|
55
|
+
draggableで入れ替えた後に、入れ替え後の値を表示まではできたのですが、その値をinput文に挿入できないでいます。配列の中の値を取得するにはどのようにすればよいのでしょうか。
|
56
|
+
|
57
|
+
|
58
|
+
|
61
59
|
### 該当ソースコード
|
62
60
|
|
61
|
+
######sorted.blade.php
|
62
|
+
|
63
|
+
```
|
64
|
+
|
65
|
+
<div id="us_dnd" class="us_dnd w-100">
|
66
|
+
|
67
|
+
<user-sorted-component v-bind:users="{{ $users }}">
|
68
|
+
|
69
|
+
</user-sorted-component>
|
70
|
+
|
71
|
+
</div>
|
72
|
+
|
73
|
+
```
|
74
|
+
|
75
|
+
######app.js
|
76
|
+
|
77
|
+
```
|
78
|
+
|
79
|
+
require("./bootstrap");
|
80
|
+
|
81
|
+
window.Vue = require("vue");
|
82
|
+
|
83
|
+
|
84
|
+
|
85
|
+
window.axios = require('axios');
|
86
|
+
|
87
|
+
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
|
88
|
+
|
89
|
+
|
90
|
+
|
91
|
+
Vue.component('user-sorted-component', require("./sorted/UserSortedComponent.vue").default);
|
92
|
+
|
93
|
+
const us_dnd = new Vue({
|
94
|
+
|
95
|
+
el: "#us_dnd",
|
96
|
+
|
97
|
+
})
|
98
|
+
|
99
|
+
```
|
100
|
+
|
63
101
|
######UserSortedComponent.vue
|
64
102
|
|
65
103
|
```
|