teratail
回答率
85.48%
質問するログイン新規登録
トップに関する質問jQuery dataTableのソート機能について

編集履歴

質問編集履歴

4

実際に出力されたHTMLを追記

2017/02/02 09:28

投稿

emeraldworm
emeraldworm

スコア16

test CHANGED
File without changes
test CHANGED
@@ -98,4 +98,350 @@
98
98
 
99
99
  </table>
100
100
 
101
+
102
+
103
+ ★実際に出力されたHTMLコード
104
+
105
+ <table id="logs" class="table table-bordered table-condensed table-hover dataTable no-footer">
106
+
107
+ <thead>
108
+
109
+ <tr class="info">
110
+
111
+ <th class="text-center">ID</th>
112
+
113
+ <th class="text-center">処理日</th>
114
+
115
+ <th class="text-center">ジョブ名</th>
116
+
117
+ <th class="text-center">タスク名</th>
118
+
119
+ <th class="text-center">処理開始日時</th>
120
+
121
+ <th class="text-center">処理終了日時</th>
122
+
123
+ <th class="text-center">処理ステータス</th>
124
+
125
+ <th class="text-center">ログ内容</th>
126
+
127
+ </tr>
128
+
129
+ </thead>
130
+
131
+ <tbody>
132
+
133
+ <tr>
134
+
135
+ <td class="text-center" rowspan="1" colspan="1">12</td>
136
+
137
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01</td>
138
+
139
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
140
+
141
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
142
+
143
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:00</td>
144
+
145
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:01</td>
146
+
147
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
148
+
149
+
150
+
151
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
152
+
153
+ </tr>
154
+
155
+ </tbody>
156
+
157
+ <tbody>
158
+
159
+ <tr>
160
+
161
+ <td class="text-center" rowspan="1" colspan="1">11</td>
162
+
163
+ <td class="text-center" rowspan="1" colspan="1">2017/01/30</td>
164
+
165
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
166
+
167
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
168
+
169
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:00</td>
170
+
171
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:01</td>
172
+
173
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
174
+
175
+
176
+
177
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
178
+
179
+ </tr>
180
+
181
+ </tbody>
182
+
183
+ <tbody>
184
+
185
+ <tr>
186
+
187
+ <td class="text-center" rowspan="1" colspan="1">10</td>
188
+
189
+ <td class="text-center" rowspan="1" colspan="1">2017/01/10</td>
190
+
191
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
192
+
193
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
194
+
195
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:40:07</td>
196
+
197
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:40:59</td>
198
+
199
+
200
+
201
+ <td class="text-center font-failed" rowspan="1" colspan="1">異常終了</td>
202
+
203
+ <td class="text-left" rowspan="1" colspan="1">dept_auth_msts_sub：ファイルが存在しません。</td>
204
+
205
+ </tr>
206
+
207
+ </tbody>
208
+
209
+ <tbody>
210
+
211
+ <tr>
212
+
213
+ <td class="text-center" rowspan="1" colspan="1">9</td>
214
+
215
+ <td class="text-center" rowspan="1" colspan="1">2017/01/01</td>
216
+
217
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
218
+
219
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
220
+
221
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:12:11</td>
222
+
223
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:14:15</td>
224
+
225
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
226
+
227
+
228
+
229
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
230
+
231
+ </tr>
232
+
233
+ </tbody>
234
+
235
+ <tbody>
236
+
237
+ <tr>
238
+
239
+ <td class="text-center" rowspan="1" colspan="1">8</td>
240
+
241
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01</td>
242
+
243
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
244
+
245
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
246
+
247
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:00</td>
248
+
249
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:01</td>
250
+
251
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
252
+
253
+
254
+
255
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
256
+
257
+ </tr>
258
+
259
+ </tbody>
260
+
261
+ <tbody>
262
+
263
+ <tr>
264
+
265
+ <td class="text-center" rowspan="1" colspan="1">7</td>
266
+
267
+ <td class="text-center" rowspan="1" colspan="1">2017/01/30</td>
268
+
269
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
270
+
271
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
272
+
273
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:00</td>
274
+
275
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:01</td>
276
+
277
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
278
+
279
+
280
+
281
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
282
+
283
+ </tr>
284
+
285
+ </tbody>
286
+
287
+ <tbody>
288
+
289
+ <tr>
290
+
291
+ <td class="text-center" rowspan="1" colspan="1">6</td>
292
+
293
+ <td class="text-center" rowspan="1" colspan="1">2017/01/10</td>
294
+
295
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
296
+
297
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
298
+
299
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:40:07</td>
300
+
301
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:40:59</td>
302
+
303
+
304
+
305
+ <td class="text-center font-failed" rowspan="1" colspan="1">異常終了</td>
306
+
307
+ <td class="text-left" rowspan="1" colspan="1">dept_auth_msts_sub：ファイルが存在しません。</td>
308
+
309
+ </tr>
310
+
311
+ </tbody>
312
+
313
+ <tbody>
314
+
315
+ <tr>
316
+
317
+ <td class="text-center" rowspan="1" colspan="1">5</td>
318
+
319
+ <td class="text-center" rowspan="1" colspan="1">2017/01/01</td>
320
+
321
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
322
+
323
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
324
+
325
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:12:11</td>
326
+
327
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:14:15</td>
328
+
329
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
330
+
331
+
332
+
333
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
334
+
335
+ </tr>
336
+
337
+ </tbody>
338
+
339
+ <tbody>
340
+
341
+ <tr>
342
+
343
+ <td class="text-center" rowspan="1" colspan="1">4</td>
344
+
345
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01</td>
346
+
347
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
348
+
349
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
350
+
351
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:00</td>
352
+
353
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:01</td>
354
+
355
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
356
+
357
+
358
+
359
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
360
+
361
+ </tr>
362
+
363
+ </tbody>
364
+
365
+ <tbody>
366
+
367
+ <tr>
368
+
369
+ <td class="text-center" rowspan="1" colspan="1">3</td>
370
+
371
+ <td class="text-center" rowspan="1" colspan="1">2017/01/30</td>
372
+
373
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
374
+
375
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
376
+
377
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:00</td>
378
+
379
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:55:01</td>
380
+
381
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
382
+
383
+
384
+
385
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
386
+
387
+ </tr>
388
+
389
+ </tbody>
390
+
391
+ <tbody>
392
+
393
+ <tr>
394
+
395
+ <td class="text-center" rowspan="1" colspan="1">2</td>
396
+
397
+ <td class="text-center" rowspan="1" colspan="1">2017/01/10</td>
398
+
399
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
400
+
401
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
402
+
403
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:40:07</td>
404
+
405
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:40:59</td>
406
+
407
+
408
+
409
+ <td class="text-center font-failed" rowspan="1" colspan="1">異常終了</td>
410
+
411
+ <td class="text-left" rowspan="1" colspan="1">dept_auth_msts_sub：ファイルが存在しません。</td>
412
+
413
+ </tr>
414
+
415
+ </tbody>
416
+
417
+ <tbody>
418
+
419
+ <tr>
420
+
421
+ <td class="text-center" rowspan="1" colspan="1">1</td>
422
+
423
+ <td class="text-center" rowspan="1" colspan="1">2017/01/01</td>
424
+
425
+ <td class="text-center" rowspan="1" colspan="1">CoreBatch</td>
426
+
427
+ <td class="text-center" rowspan="1" colspan="1">ImportCompanyData</td>
428
+
429
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:12:11</td>
430
+
431
+ <td class="text-center" rowspan="1" colspan="1">2017/02/01 11:14:15</td>
432
+
433
+ <td class="text-center font-success" rowspan="1" colspan="1">正常終了</td>
434
+
435
+
436
+
437
+ <td class="text-left" rowspan="1" colspan="1">バッチ処理が正常終了しました。</td>
438
+
439
+ </tr>
440
+
441
+ </tbody>
442
+
443
+ </table>
444
+
445
+
446
+
101
447
  ```

3

ソースコードの整形

2017/02/02 09:28

投稿

emeraldworm
emeraldworm

スコア16

test CHANGED
File without changes
test CHANGED
@@ -10,11 +10,9 @@
10
10
 
11
11
  ```
12
12
 
13
- <script src="/js/jquery.dataTables.min.js"></script>
14
-
15
13
  <script type="text/javascript">
16
14
 
17
- <!-- 検索結果テーブルのJQuey -->
15
+ <!-- 検索結果テーブルのjQuery -->
18
16
 
19
17
  jQuery(function($){
20
18
 
@@ -24,7 +22,7 @@
24
22
 
25
23
  });
26
24
 
27
- $("#search_result").dataTable({
25
+ $("#logs").dataTable({
28
26
 
29
27
  lengthChange: false,
30
28
 
@@ -46,58 +44,58 @@
46
44
 
47
45
  </script>
48
46
 
47
+ <table id="logs" class="table table-bordered table-condensed table-hover dataTable no-footer">
49
48
 
49
+ <thead>
50
50
 
51
- <table id="logs" class="table table-bordered table-condensed table-hover dataTable no-footer">
51
+ <tr class="info">
52
52
 
53
- <thead>
53
+ <th class="text-center">ID</th>
54
54
 
55
- <tr class="info">
55
+ <th class="text-center">処理日</th>
56
56
 
57
- <th class="text-center">ID</th>
57
+ <th class="text-center">ジョブ名</th>
58
58
 
59
- <th class="text-center">処理日</th>
59
+ <th class="text-center">タスク名</th>
60
60
 
61
- <th class="text-center">ジョブ名</th>
61
+ <th class="text-center">処理開始日時</th>
62
62
 
63
- <th class="text-center">タスク名</th>
63
+ <th class="text-center">処理終了日時</th>
64
64
 
65
- <th class="text-center">処理開始日時</th>
65
+ <th class="text-center">処理ステータス</th>
66
66
 
67
- <th class="text-center">処理終了日時</th>
67
+ <th class="text-center">ログ内容</th>
68
68
 
69
- <th class="text-center">処理ステータス</th>
69
+ </tr>
70
70
 
71
- <th class="text-center">ログ内容</th>
71
+ </thead>
72
72
 
73
- </tr>
73
+ <tbody th:remove="all-but-first" th:each="log : ${batch_log_list}">
74
74
 
75
- </thead>
75
+ <tr>
76
76
 
77
- <tbody th:remove="all-but-first" th:each="log : ${batch_log_list}">
77
+ <td class="text-center" th:text="${log.id}"></td>
78
78
 
79
- <tr>
79
+ <td class="text-center" th:text="${log.operation_date}"></td>
80
80
 
81
- <td class="text-center" th:text="${log.id}"></td>
81
+ <td class="text-center" th:text="${log.job_name}"></td>
82
82
 
83
- <td class="text-center" th:text="${log.operation_date}"></td>
83
+ <td class="text-center" th:text="${log.task_name}"></td>
84
84
 
85
- <td class="text-center" th:text="${log.job_name}"></td>
85
+ <td class="text-center" th:text="${log.start_date}"></td>
86
86
 
87
- <td class="text-center" th:text="${log.task_name}"></td>
87
+ <td class="text-center" th:text="${log.end_date}"></td>
88
88
 
89
- <td class="text-center" th:text="${log.start_date}"></td>
89
+ <td th:if="${log.operation_status == '正常終了'}" class="text-center font-success" th:text="${log.operation_status}"></td>
90
90
 
91
- <td class="text-center" th:text="${log.end_date}"></td>
91
+ <td th:if="${log.operation_status != '正常終了'}" class="text-center font-failed" th:text="${log.operation_status}"></td>
92
92
 
93
- <td th:if="${log.operation_status == '正常終了'}" class="text-center font-success" th:text="${log.operation_status}"></td>
93
+ <td class="text-left" th:utext="${log.log_content}"></td>
94
94
 
95
- <td th:if="${log.operation_status != '正常終了'}" class="text-center font-failed" th:text="${log.operation_status}"></td>
95
+ </tr>
96
96
 
97
- <td class="text-left" th:utext="${log.log_content}"></td>
97
+ </tbody>
98
98
 
99
- </tr>
99
+ </table>
100
100
 
101
- </tbody>
102
-
103
- </table>```
101
+ ```

2

ソースコードの整形

2017/02/02 07:58

投稿

emeraldworm
emeraldworm

スコア16

test CHANGED
File without changes
test CHANGED
@@ -8,7 +8,7 @@
8
8
 
9
9
 
10
10
 
11
- `
11
+ ```
12
12
 
13
13
  <script src="/js/jquery.dataTables.min.js"></script>
14
14
 
@@ -100,4 +100,4 @@
100
100
 
101
101
  </tbody>
102
102
 
103
- </table>`
103
+ </table>```

1

ソースコードの整形

2017/02/02 07:55

投稿

emeraldworm
emeraldworm

スコア16

test CHANGED
File without changes
test CHANGED
@@ -7,6 +7,8 @@
7
7
  以下、ソースコード（抜粋）になります。
8
8
 
9
9
 
10
+
11
+ `
10
12
 
11
13
  <script src="/js/jquery.dataTables.min.js"></script>
12
14
 
@@ -98,4 +100,4 @@
98
100
 
99
101
  </tbody>
100
102
 
101
- </table>
103
+ </table>`