teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

2

追記事項

2019/08/01 01:04

投稿

moshi
moshi

スコア90

title CHANGED
File without changes
body CHANGED
@@ -54,4 +54,9 @@
54
54
 
55
55
  しかし、固定列(チェック列まで)のところでスクロールをすると
56
56
  ![固定列でスクロール](066c467bf269fcc87955a224d0d5de5b.png)
57
- 固定列のみがスクロールされ、固定されていない列についてはスクロールされないです。
57
+ 固定列のみがスクロールされ、固定されていない列についてはスクロールされないです。
58
+
59
+ ### 追記
60
+ 大事なことを書き忘れていました。
61
+ これはPCで見た時には発生しません。どこでスクロールしても同期がとれ、問題なくスクロールできます。
62
+ タブレット端末で表示したときのみなります。(Googleの開発者ツールでもなります。)

1

ソースと例のキャプチャを載せました

2019/08/01 01:04

投稿

moshi
moshi

スコア90

title CHANGED
File without changes
body CHANGED
@@ -20,4 +20,38 @@
20
20
  固定していない列との同期が取れなくなってしまいます。
21
21
 
22
22
  どうすればよいでしょうか?
23
- Handsontableをnewするときに何かオプションを付けるのでしょうか?
23
+ Handsontableをnewするときに何かオプションを付けるのでしょうか?
24
+
25
+ ### ソース
26
+ ```
27
+ handsonTable = new Handsontable(container, {
28
+ data : data,
29
+ width : 1300,
30
+ height : calcDataTableHeight(),
31
+ renderAllRows : true,
32
+ cells : function(row, col, prop) {
33
+ var cellProperties = {};
34
+ cellProperties.readOnly = true;
35
+
36
+ return cellProperties;
37
+ },
38
+ tableClassName : 'handsonTable',
39
+ fixedColumnsLeft: 5, // 左の列を固定
40
+ columns : columnsArray,
41
+ colWidths : colWidths,
42
+ rowHeights : 25,
43
+ colHeaders : colHeaders // tureにするとヘッダーがA,B,Cってなる
44
+ });
45
+ ```
46
+ というプロパティを設定しています。
47
+
48
+ ### 例
49
+ 左から3番目のチェックまでが固定(fixedColumnsLeft: 3)の場合
50
+ ![初期画面](08378cfa0b84275c43c12843f2cdd721.png)
51
+ の固定列でない部分(日付列部分)でスクロールすると
52
+ ![固定列でない場所でスクロール](1d0c6dc891cfcdbf45460d46c3290c1b.png)
53
+ 問題なくスクロールされます。
54
+
55
+ しかし、固定列(チェック列まで)のところでスクロールをすると
56
+ ![固定列でスクロール](066c467bf269fcc87955a224d0d5de5b.png)
57
+ 固定列のみがスクロールされ、固定されていない列についてはスクロールされないです。