質問編集履歴
2
HTMLと追記
title
CHANGED
File without changes
|
body
CHANGED
@@ -7,4 +7,44 @@
|
|
7
7
|
```
|
8
8
|
今Tableは100行分最初に用意しておき、必要に応じて10行だったり20行だったりを表示しています。
|
9
9
|
しかし上記の方法では画面に見えてない残りの90行分もチェックボックスがONされてしまいます。
|
10
|
-
表示されている行のみチェックONさせる方法はないでしょうか?
|
10
|
+
表示されている行のみチェックONさせる方法はないでしょうか?
|
11
|
+
```html
|
12
|
+
<table id=srctable>
|
13
|
+
<thead>
|
14
|
+
<tr>
|
15
|
+
<th><input type="checkbox" id="checkAll"></th>
|
16
|
+
<th>社員番号</th>
|
17
|
+
<th>社員名</th>
|
18
|
+
</tr>
|
19
|
+
</thead>
|
20
|
+
<tbody>
|
21
|
+
<tr>
|
22
|
+
<td><input type="checkbox" name="chk1"></td>
|
23
|
+
<th>0001</th>
|
24
|
+
<th>AAAA</th>
|
25
|
+
<tr>
|
26
|
+
<tr>
|
27
|
+
<td><input type="checkbox" name="chk1"></td>
|
28
|
+
<th>0002</th>
|
29
|
+
<th>BBBB</th>
|
30
|
+
<tr>
|
31
|
+
<tr>
|
32
|
+
<td><input type="checkbox" name="chk1"></td>
|
33
|
+
<th>0003</th>
|
34
|
+
<th>CCCC</th>
|
35
|
+
<tr>
|
36
|
+
</tbody>
|
37
|
+
```
|
38
|
+
となっております。
|
39
|
+
表示の処理は
|
40
|
+
```javascript
|
41
|
+
for(i=0; i<a_tr_items.length; i++){
|
42
|
+
if(i<(list_num)){
|
43
|
+
tr_items[i].style.display = 'table-row';
|
44
|
+
} else {
|
45
|
+
tr_items[i].style.display = 'none';
|
46
|
+
}
|
47
|
+
}
|
48
|
+
```
|
49
|
+
でやっております。
|
50
|
+
list_numには何件表示するかの値が入っております。
|
1
JSを修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,15 +1,9 @@
|
|
1
1
|
今以下の方法でCheckBoxの全選択、全解除を実現しています。
|
2
2
|
```javascript
|
3
|
-
$(
|
3
|
+
$( checkAll ).on('click', function(e) {
|
4
|
-
var boxCount = $( checkBox ).length; //全チェックボックスの数を取得
|
5
|
-
var checked = $( checkBox + ':checked' ).length; //チェックされているチェックボックスの数を取得
|
6
|
-
|
7
|
-
if( checked === boxCount ) {
|
8
|
-
$( checkAll ).prop( 'checked', true );
|
9
|
-
} else {
|
10
|
-
$(
|
4
|
+
//$( checkBox ).prop('checked', this.checked );
|
11
|
-
|
5
|
+
$(checkBox).prop('checked', $(this).prop('checked')).trigger('change');
|
12
|
-
});
|
6
|
+
});
|
13
7
|
```
|
14
8
|
今Tableは100行分最初に用意しておき、必要に応じて10行だったり20行だったりを表示しています。
|
15
9
|
しかし上記の方法では画面に見えてない残りの90行分もチェックボックスがONされてしまいます。
|