• ベストアンサー

エクセルのセル単位のhtmlへの表示方法

ホームページビルダーにてhtmlファイル内のセルを作成しています。 そこにエクセルのセルのデーターをリンクさせたいのです。 具体例を申しますと エクセルでは 人口推移というファイルに○○市人口というsheetがあり、男女年代地区別に管理しています。 そのデーターのうちhtmlでは 男女のみ抽出して表示したいのです。抽出・・・というよりリンクです。 エクセルのデーターが更新されれば同じようにhtml内のデーターの更新させたいのです。 htmlのエクセルのタグは <TR> <TD class="hpb-cnt-tb-cell1">男性人口</TD> <TD class="hpb-cnt-tb-cell2">女性人口</TD> </TR> <TR> <TD class="hpb-cnt-tb-cell1"></TD> <TD class="hpb-cnt-tb-cell2"></TD> </TR> <TR> <TD class="hpb-cnt-tb-cell1"></TD> <TD class="hpb-cnt-tb-cell2"></TD> </TR> といように作成してあります。 他の方法でもよいので、良い方法がありましたらお教え下さい。

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

通常の方法ではできないので、ajaxなどによることになるでしょう。 例えば、 http://www.openspc2.org/JavaScript/Ajax/Excel/ http://blog.sorasol.co.jp/?p=13 でも、自作は面倒なので、ライブラリなどを利用するほうが簡単でしょう。 http://feed.designlinkdatabase.net/feed/outsite_240073.aspx さらに、Win+IE限定でよければ、VBScript、ActiveXなどを利用することで直接エクセルを開くことが可能です。ただし、たいていの場合、ユーザへのセキュリティ警告がでると思う。(通常の設定であれば) ほかにも、IE限定ならデータバインドなんていうお便利機能も用意されているけど… http://www.makoto3.net/document/databind/databind_all.html いずれにしろ、ある程度の知識が必要になるでしょうし、当たり前ですが更新したエクセルデータ(またはcsvなど)のアップロード作業は必要です。 以前、似たようなことを試みたことがありますが、エクセル本体を起動する方式だと、設置は比較的簡単ですが起動に時間がかかるので、ユーザにとっては表示までに多少なりとも待つ感じがします。 その時は結局、エクセル側のマクロで『必要なデータに変換したものをアップロードする』機能を作成しておいて、更新時に自動的にtextファイルでUPするようにしてしまい、ブラウザへの出力はCGIを利用することにしました。 これだとエクセルを起動しなくても良いので、ファイルへのアクセスも気になりません。(ajax利用でもほぼ同様でしょう)

midori-makibao
質問者

お礼

データーバインドで実行してみたらうまくいきました。

その他の回答 (1)

  • n_kudoujp
  • ベストアンサー率43% (81/187)
回答No.1

私もエクセルとホームページの連携はやったことがないですが、基本的にホームページを動的に変更させたい場合は、HTMLだけではかなり手間がかかると思いますよ。 エクセルが更新されたら、誰かがHTMLソースを直接編集して、ホームページを更新するという流れになるからです。 ホームページ上からデータを直接入力して変更したり、エクセルと動的にリンクさせるには、PerlやPHPといった言語で、プログラムを組まないと出来ないと思いますよ。 また、特定データを抽出するとなると、一般的にはMySQLやOracleといったデータベースを使用します。 テキストファイルにデータを区切って記載して、データベースの代わりとすることは出来るのですが、検索に非常に時間が掛かり、管理も煩雑になるので、データが大量にある場合は、余りオススメできませんね。 一般的にエクセルをホームページで表示する場合は、ファイルにリンクを張って、直接ブラウザにエクセルを表示するやり方が多いと思いますよ。

関連するQ&A

  • ホームページビルダー html書き方

    HPBでタグを使ってお問い合わせのフォームを作っている所ですが、 項目名とテキストエリアを横並びにしたいのですが上下にしかなりません。 貼り付けてみましたが、これで分かりますでしょうか? どうすれば、テキストエリアを横に出来るかお分かりの方いらっしゃいましたら お教えくださいませ。宜しくお願い致します。 <TBODY> <TR> <TD align="right" valign="top" class="hpb-cnt-tb-cell2"><TEXTAREA name="otoiawasenaiyou" rows="10" cols="50"></TEXTAREA></TD> </TR> </TBODY> </TABLE> <CENTER><br> </CENTER>

  • tableの大きさが編集領域とブラウザで異なる

    現在、ビルダーにてHPを作成しております。 tableの大きさが編集画面で見るのと、ブラウザ上で見るのでは 大きさが異なってしまいます。 解決方法を教えてください。よろしくお願いします。 <DIV style="width : 157px;height : 607px;top : 72px;left : 2px; position : absolute; z-index : 9; " id="_HPB_LAYOUT_LMV0" class="hpb-side-cell3" align=""> <DIV>   <TABLE cellpadding="0" cellspacing="0" class="hpb-vmenu1" id="_HPB_LINK_MENU_TABLE_01" width="157" height="200" border="1" style="table-layout: fixed;"> <TBODY> <TR> <TD class="hpb-vmenu1-head" height="15"><IMG src="c5.gif" alt="" width="1" height="1" border="0"></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="#" class="hpb-vmenu1-link0"><SPAN style="font-size:11pt">文字</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="sub1.html" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">メニュー</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="sub2.html" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">表</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="sub3.html" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">期間限定</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="sub4.html" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">紹介</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="sub2.html" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">ご注文</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="#" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">ご相談・ご質問</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="#" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">コンセプト</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-idle1" height="50"><STRONG><A href="#" class="hpb-vmenu1-link1"><SPAN style="font-size:11pt">地域</SPAN></A></STRONG></TD> </TR> <TR> <TD class="hpb-vmenu1-foot" height="15"><IMG src="c5.gif" alt="" width="1" height="1" border="0"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV>

  • ie8のcssでcol要素のwidthがきかない

    ie7でうまく表示しているソースで、先日ie8にアップグレードし表示を確認しましたら、セルの幅の設定がうまくいかず、すべてのセルの幅が同じ長さ(省略値?)になっていました。 いろいろと確認して行くと、どうもcol要素のcssのwidthが無視されているようでした。 cssはまだ勉強し始めたばかりで詳しくありません。cell11,cell12の中にwidthを指定すればwidthは有効のようです。 どなたか、どこを修正すれば直るか教えてください。ソースは以下の通りです。 ------------------------------------------- htmlのソース <table class="table2"> <col class="col41"> <col class="col42"> <col class="col51"> <col class="col52"> <col class="col41"> <col class="col42"> <col class="col51"> <col class="col52"> <tr> <th class="cell12" colspan="2" align="center" nowrap>3月</th> <th class="cell12" colspan="2" align="center" nowrap>4月</th> <th class="cell12" colspan="2" align="center" nowrap>5月</th> <th class="cell12" colspan="2" align="center" nowrap>6月</th> </tr> <tr> <th class="cell11" nowrap>点数</th> <th class="cell11" nowrap>金額</th> <th class="cell11" nowrap>点数</th> <th class="cell11" nowrap>金額</th> <th class="cell11" nowrap>点数</th> <th class="cell11" nowrap>金額</th> <th class="cell11" nowrap>点数</th> <th class="cell11" nowrap>金額</th> </tr> <tr> <td class="cell12" nowrap>100</td> <td class="cell12" nowrap>200,000</td> <td class="cell12" nowrap>50</td> <td class="cell12" nowrap>100,000</td> <td class="cell12" nowrap></td> <td class="cell12" nowrap></td> <td class="cell12" nowrap></td> <td class="cell12" nowrap></td> </tr> </table> ----------------------------------------- cssのソース .table2 { border : 0px solid black ; border-collapse: collapse ; margin: 0px; padding: 0px; } .col41 { /* 緑 各月 点数 */ text-align: right; width: 50px; background-color: #e0ffff ; } .col42 { /* 緑 各月 金額 */ text-align: right; width: 80px; background-color: #e0ffff ; } .col51 { /* 白 各月 点数 */ text-align: right; width: 50px; background-color: #ffffff ; } .col52 { /* 白 各月 金額 */ text-align: right; width: 80px; background-color: #ffffff ; } .cell11 { border-right : 1px solid silver ; border-bottom: 1px solid black ; } .cell12 { border-right : 1px solid silver ; border-bottom: 1px solid silver ; } よろしくお願いします。

    • ベストアンサー
    • CSS
  • Dreamweaverでテーブルセルの選択方法

    Dreamweaver MX 2004を使用しています。 テーブルのセルをドラッグですべて選択し、 「プロパティ」でスタイルを選択したのですが、 スタイルがセルに設定されるのではなく(A)、 セルの”行”に設定されてしまいました(B)。 どうすれば、セルごとにスタイルを設定(A)することができるのでしょうか? よろしくお願いします (A) <table> <tr> <td class="f1"></td> <td class="f1"></td> </tr> </table> (B) <table> <tr class="f1"> <td></td> <td></td> </tr> </table>

  • IE7とfirefox2.0でcssによってテーブルのセルの背景の表示がfirefoxで表示されないことについて。

    cssを外部リンクで td.1-cell{ width:200px;   background:#F8F8F8; } と記述し、 <td class=1-cell> で呼び出したところ、IE7では正確に表示されているのに対して、 firefoxで背景の色が表示されず無色となってしまいます。 どうすればfirefoxとIE両方で表示できるのでしょうか。

    • ベストアンサー
    • HTML
  • javascriptでJSONデータの生成方法

    現在PerlのフレームワークであるMojoliciousとJavascriptのjQueryを使ってAjaxを利用したアプリケーションを作ろうとしているのですが、クライアント側で、サーバに送信するためのJSON形式のデータがうまく作れません。 例えば、ブラウザ上の表のセルをダブルクリックしたときにそのデータを書き換えられるようにし、その更新データをJSONでサーバ側に送りたいのですが、 <table> <tr><th>name</th><th>email</th></tr> <tr><td class="name">山田</td><td class="email">yamada**@gmail.com</td></tr> </table> とある表のセルの山田のアドレスをyamada**@gmail.com -> yamada**@yahoo.co.jpと変更した場合、javascript(jQuery)で次のようなJSONデータを作りたいです。 { "email" : "yamada**@yahoo.co.jp"} 左側のemailは動的にセルのclass属性から取得したいのですが、方法が分かりません。 実際にはemail以外にも多数の列がありますので、なるべく動的にclass属性を取得したいのですが、良いJSONの生成方法やJSONを用いた他のデータ構造があれば教えていただきたいです。

  • 枠線が表示されません

    初歩的な質問ですみません。 以下のようなテーブルを組んでいるのですが 枠線が表示されません。 どこがおかしいのでしょうか? 宜しくお願いします。 ==================================HTML================================== <html> <head> <link rel="stylesheet" href="test.css" type="text/css"> </head> <body> <table class="table1"> <tr> <th>左</th> <th>真ん中</th> <th>右</th> </tr> <tr> <td class="blue">1</td> <td class="blue">田中</td> <td class="blue">55</td> </tr> <tr> <td class="white">2</td> <td class="white">鈴木</td> <td class="white">42</td> </tr> <tr> <td class="blue">3</td> <td class="blue">斉藤</td> <td class="blue">20</td> </tr> </table> </body> </html> ==================================CSS================================== /*テーブル全体*/ .table1 { border-collapse: collapse; /* 枠線の表示方法 重ねる */ border: 2px #757575 solid; /* テーブル全体の枠線(太さ・色・スタイル)solid:実線 */ margin-top: 10px; /* 表示位置 */ margin-left: 25px; /* 表示位置 */ } /*テーブルの見出し部分*/ th { font-size:10pt; text-align:left; /*左寄せ*/ color:#888888; /*テキスト色*/ background-color:#B8B8B8; /*背景色*/ border-style: solid; /* 枠の種類 */ border-width: 0px 1px; /* 枠の幅 */ border-spacing: 0; /* 隣のセルとの間隔 */ } /*テーブルのデータ部分*/ td { font-size:10pt; text-align:left; /*左寄せ*/\ border-style: solid; /* 枠の種類 */ border-width: 0px 1px; /* 枠の幅 */ } .blue{ background-color: #CCCCFF; } /* セル色:青 */ .white{ background-color: #FFFFFF; } /* セル色:白 */ /*背景色と文字色*/ body { background-color: #969696; color: #000000; }

    • 締切済み
    • CSS
  • HTML中のTABLEのデータを抽出する方法

    あるサイトの <table>タグ中のデータを抽出して、エクセルにコピーし そのデータを分析したいと考えています。 具体的にはタグ情報を削除して、データをカンマ(,)区切りで表示し、 それをコピペして、エクセルに貼り付ける方法を考えています。 <table> <tr> <td>100</td> <td>200</td> </tr> <tr> <td>300</td> <td>400</td> </tr> </table> ↓ 100,200 300,400 上記を実現できる方法をご存知でしたらぜひ教えてください。 いろいろ調べたところ、ブックマークレットという方法で できそうですが、マッチするものを見つけることができませ んでした。

  • dwCSで、テーブル内のセルに対するペースト

    質門させて頂きます。宜しくお願い致します。 adobe dreamweaverCS5.5でのテーブルにセルに対してペーストをする時のことです。 ▼対象ソース部分▼ <table width="911" border="0" cellspacing="1" cellpadding="2"> <tr> <td bgcolor="#E6FAFF" class="text3">ドラえもん<br></td> <td bgcolor="#E6FAFF" class="text3">のび太</td> <td bgcolor="#E6FAFF" class="text3">しずかちゃん</td> </tr> </table> 上記のようなテーブルがあって、 セルに入っている「ドラえもん」「のび太」「しずかちゃん」というそれぞれの文字列を 「キテレツ」「コロ助」「みよちゃん」に変更したいと思います。 そこでExcelなどで、3つ横にならんだセル、 例えば「キテレツ」「コロ助」「みよちゃん」といった値の入ったセルをそれぞれ複数選択して、コピーし、dreamweaverのデザインビューで、上記テーブル、セルを選択してペーストすると以下のようになってしまいます。 ▼現状の結果▼ <table width="911" border="0" cellspacing="1" cellpadding="2"> <tr> <td>キテレツ</td> <td>コロ助</td> <td>みよちゃん</td> </tr> </table> これを、以下のように、値だけをペーストしたいのですが、 何か良い方法がございますか? ▼理想の結果▼ <table width="911" border="0" cellspacing="1" cellpadding="2"> <tr> <td bgcolor="#E6FAFF" class="text3">キテレツ</td> <td bgcolor="#E6FAFF" class="text3">コロ助</td> <td bgcolor="#E6FAFF" class="text3">みよちゃん</td> </tr> </table> 要はテーブルのセルに設定した、スタイルを維持した状態で値のみをペーストしたいのです。 お詳しい方いらっしゃいましたら、ご教示のほど何卒宜しくお願い申し上げます。

  • セルをまたがるリンク。

    セルをまたぐようなリンクを作りたいのですが、何かいい方法はないでしょうか。 記述は間違っていますが、イメージ的には以下のようなことがしたいです。 <table>  <tr>   <td><a href="#">09月20日</td>   <td>題名</a></td>  </tr> </table> これができない理由はなんとなくわかっているので、これを実現するような方法は何かないでしょうか?

    • ベストアンサー
    • HTML

専門家に質問してみよう