ASP.NET FORMで"Grid.js"を使用した際のCSS適用

Question

Grid.jsサンプル(ソリューションリンクあり)
http://surferonwww.info/BlogEngine/post/2013/02/04/freezing-header-and-column-of-gridview-by-using-javascript-gridjs.aspx

上記サンプルにおいて、グリッドビューテーブルのデザインを変えようとしているのですが、どうやってもCSS適用が反映されずにサンプル通りの絵面のままです。
そのくせ基本的な部分(ex. bodyに適用させたフォント)は反映されます。

Grid.js使用したことがある方はどうされたでしょうか？

Answer 1

上記サンプルにおいて、グリッドビューテーブルのデザインを変えようとしているのですが、どうやってもCSS適用が反映されずにサンプル通りの絵面のままです。

何をどのように変えようとしたのか書いてないので分かりませんが、もし基になる GridView のスタイルを変えて Grid のスタイルを変えようとしているなら、それではダメです。

質問者さんが参考にしている記事に書いてありますが、

"GridView が生成した table の DOM は、Grid.js が生成した別テーブルに置き換えられます。つまり、上の画像に表示されているテーブルは GridView ではなく、Grid.js が生成した別物です"

ということは理解してますか？

IE の F12 開発者ツールを使って「Grid.js が生成した別物」というのはどういうものか見てください。

GridView から生成された table, tr, th, td 要素は消えてなくなっていて、div 要素が入れ子になっている表に置き換えれれていて、それら各 div 要素に Grid.css に定義されているスタイルが適用されているはずです。

それを自分の望むスタイルに変更してみてください。

F12 開発者ツールの［DOM Explorer］で［スタイル］を表示し、それを書き換えるとリアルタイムでどのようにスタイルが変わるか分かるので便利です。

Comments

[退会済みユーザー]

https://teratail.com/questions/135841 でこのスレッドの放置を指摘され、逆切れしてマイナス評価を付けた？　そういうことをすると誰もあなたを相手にしなくなりますよ。