2008年12月21日日曜日

エクセルをxmlにしてspryでサクット表示 やっぱりJquery

さくっと表示させるために、 2日考えてしまった。

テーブルとかあまり仕事なかったのですが、たまたま書道教室一覧をいうのを載せてくれという話になり、最初やってたら、変更がよくあるようなので、これはちょっとどうしようかなと考えて、
Spryというのがあったなと

実は私は、Adobeが全体的に嫌いで、Adobe Dreamweaver CS3 ほとんど使ってない。
立ち上がりが遅いのがイラつくため、常にexpression Web ばかりである。

で、このSprayはCS3を買った人のものみたい?で落してくるのにIDがいったりする。
(私しゃその考え方もキライなんだよ) 

確かに、でもこれは便利だわ。初めて買ってよかったかなと(高すぎるけど)

で、問題はこれも安売りにつられて買ったオフィス2007ですが、エクセルの初心者が作ったエクセルのデータをさくっとxmlにならなかったらいかんやろ! と思っていたのですが、ならないのね。 単純には…。なんか、simple XMLって何なん?って思ってしまった。(マイクロソフトに就職して改革したいわ。お前のところも作るものがおかし過ぎる!)

で、まずcsvに変換する。

それをアクセスで吸い込む(csvにしないと、どうしてもエラーになりましたわ。不思議に)

で、アクセスをフリーソフトで変換することにした。

何かが大きく間違っている気がする。この簡単な機能がなんで名前空間とか、なんやらかたらがいるのだろうか。 ウィザードで簡単に書きだせるようにせないかんわ。


ただjquery とspryって共存しないのね。最初jquery で テーブルをシマシマにするのを使っていたのでちょっとつまずく。

spray のデザイン要素についていろいろ探したらありました。

とっても簡単で、

<style>
.odd{ background-color:#00CCFF;}
.even{ background-color:#0066FF;}
.hover{background-color:#0000FF;}
.selected{background-color:#3399FF;}
</style>


ってしたらいいだけだった。 やはりデザイン的にこっちの方が自在でいいと思う。

 ただ、今回IEで表示されないというエラーがあり、何がどういかんのか正直わからなかったけど、どうもxmlにつける名前にアンダーバーつけたり、特殊なものにせずに素直に名前つけないとダメみたい。 よくわからないのですが。 気まぐれな感じがする。

jquery でcsvを読み込むという同じようなものを見つけましたが、tr td とかを直感的に書けないので、めんどくさそうで…。
とか言いながらもいいかもしれんと、思わず研究して作ってしまった…。
が、あいうえお順でソートするわけでもなく、数字じゃないと意味がないみたい。
で、決定的なのがxmlじゃなくてcsvだからいろんな加工がしにくというのはある。googole map の情報とか何気にカンマとかあるし。

***********
後日考えたんだけど、ジャンプページを作ってこの問題は解決した!
***********


で、これは普通に読んだらわからん。どうしてこの人、人を寄せ付けないような解説なんでしょうか? もうちょっとアホにもわかるように説明してくれないと。これはある程度プログラムわかっている人向きで、実際簡単なのに超苦労した。all abaoutの解説 なかったらめげてたと思うわ。ボタンにしてるのがわけわからん。作ってもらってて文句いうのはあれですが。

結局、ここ見たら間違えますので
こっちを見て、 <div id="view0"></div>
をきちんと書かないと動かないことに気がつく必要がある。

後日、西畑さんの講座を参考に

<div id="view2" class="data">
<script type="text/javascript">
//<![CDATA[
$(function(){
$('#view2').csv2table('osaka.csv',{
onload : function(id,op,data,ary){
$('tr:even','#'+id).css('background','#dedeee');
$('tr','#'+id).css('line-height','2em'); <*-- ← 追加 -->
}
})
});
//]]>

</script>

と若干加工することにより表(サンプル)を幅の広さを調整したらできた。
hoverはダメだった。いろいろしたけど。
jquery.csv2table.js の本体のtr td の色をいじることもできた。(がIEで表示されなくなって思わずもとにもどした…)

まぁ。これならいいかなぁと。

ムチャ、疲れた! たったこれだけのことに!おもしろかったけど。

ここにさりげなく書かれていたのですが

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.2");</script>

このように書いたら常に最新のjqueryが使えるし、多くのサイトがこれを使っているので、一般的なパソコンにはキャッシュされているから表示が早くなる!

なるほどなと思った。 
結構大きいデータだから本当にこれはアイデアだと思う。
実際、書き換えてみたら早いような気がする。嬉しかった!

もう、こうなってくるとですね。あらゆるものをjqueryを使わないといかんってことで、ますますspry使えないかもしれんね。
挙動はやはり SpryよりもJqueryの方がいい気がするし、プログラムもわかる気がする。
本当に自分のしたいようにするには、Jqyeryで XMLを自在に読み込み加工できるのがいいと思うので次はこれを勉強したいが、もう本当にやりたいことだらけで…。

お問合せフォーム

お名前 :
Email: (必須)
メッセージ: (必須)


0 コメント :

コメントを投稿



連絡フォーム

名前

メール *

メッセージ *

サイト内検索

View My Stats