まずは仕様上、どうにもならないこと。
現状カラムをプリセットで選択しておいて必要なカラムだけ表示させるスクリプトを置いている。
その上でDataTablesでテーブルの整形を行っているのだが、この２つが連動しないため、DataTablesのページ切り替え機能と
カラム選択機能がうまく働かない。つまり１ページ目を見ていて、カラムを選び直したとする。そのページでは選び直したカラムがきちんと表示されているのだが、２ページ目に移動すると、ヘッダだけは選び直したカラム表示で、データ部分は選び直す前のカラムが出てきて、ヘッダとデータの内容がずれてしまうのだ。
２つの機能がそれぞれ今見えている部分だけにしか適用されないからこういうことになるのだと思う。
なので、ページング機能は使えない。
ということで元の縦スクロールに戻したわけだが、そうするとやっぱりスクロールでヘッダが見えなくなってしまい、具合が悪いので、今度はScrollYという機能をDataTablesで使おうとしたのだが、カラムの横幅が、ヘッダとデータで別々に加工されてしまい、またまたズレが生じてしまう。これはDataTablesの持っているバグらしいのだが、バグ対策として提示されている方法がどうもうまく機能せず、やはり使えないということに。
折角フィルター機能はうまくうごいているので、また違うプラグインに移行するのは避けたいのだがなあ。
<script>
$(function(){
$("#result").DataTable({
"paging": false,
"scrollY": 200,
"scrollX": true,
// "lengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
}).columns.adjust().draw();
});
</script>こういうふうに.columns.adjust()でいけると書いているページが多いんだけどなあ。
どうして駄目なんだろう？
