htmlとjavascriptの書き方について
- htmlとjavascriptの書き方についての要約文1
- htmlとjavascriptの書き方についての要約文2
- htmlとjavascriptの書き方についての要約文3
- ベストアンサー
htmlとjavascriptの書き方について
データバインドを使用してテキストのデータをhtmlにて表示するよう以下のように作成しています。 この際、現在表示しているhtmlのファイル名を取得し、ファイル名とテキストの”no”が一致したデータだけ表に表示させたいと考えています。（下記サンプルでは101を固定表示するようにしています） どのようにすれば実現可能かご教示お願いいたします。 ■101.html■ <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> function GetFileName(file_url){ file_url = file_url.substring(file_url.lastIndexOf("/")+1,file_url.length) file_url = file_url.substring(0,file_url.indexOf(".")); return file_url; } document.write(GetFileName(location.href)); </script> <TABLE DATASRC="#carData" BORDER=1> <TR BGCOLOR="silver"> <TD>管理No</TD> <TD>車名</TD> <TD>メーカー</TD> <TD>色</TD> <TD>生産年</TD> <TD>価格</TD> </TR> <TR> <TD><SPAN DATAFLD="no"></SPAN></TD> <TD><SPAN DATAFLD="name"></SPAN></TD> <TD><SPAN DATAFLD="maker"></SPAN></TD> <TD><SPAN DATAFLD="color"></SPAN></TD> <TD><SPAN DATAFLD="year"></SPAN></TD> <TD><SPAN DATAFLD="price"></SPAN></TD> </TR> </TABLE> <!-- データベース用オブジェクトの指定 --> <OBJECT ID=carData CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <PARAM NAME="DataURL" VALUE="car.txt"> <PARAM NAME="UseHeader" VALUE="true"> <PARAM NAME="filter" VALUE="no=101"> </OBJECT> </BODY> </HTML> ■car.txt■ name,maker,color,year:Int,price:Int,no:Int アコード,ホンダ,白,92,800000,100 マークII,トヨタ,白,94,1500000,101 カムリ,トヨタ,黒,90,550000,102 サニー,ニッサン,シルバー,96,1200000,103 MPV,マツダ,赤,91,1350000,104 デミオ,マツダ,濃紺,95,1400000,105 シビック,ホンダ,青,93,1100000,106 シーマ,ニッサン,白,91,2100000,107 ゴルフ,フォルクスワーゲン,シルバー,94,1700000,108 シビック,ホンダ,シルバー,92,890000,109 カローラ,トヨタ,白,92,550000,110
- takezouu
- お礼率69% (9/13)
- JavaScript
- 回答数13
- ありがとう数10
- みんなの回答 （13）
- 専門家の回答
質問者が選んだベストアンサー
[ANo.12] 訂正かも | var no = location.href.match(/([^/\\]*).html$/)[1]; でダメなら、 | var no = location.href.match(/([^\/\\]*).html$/)[1]; で！
その他の回答 (12)
- dscripty
- ベストアンサー率51% (166/325)
[ANo.10] のお礼から引用 「当方の要件で別のアプリケーションから起動する必要があり、 #101を指定できません。 別のアプリケーション仕様でファイル名を指定して起動するようになっているため ファイル名の命名規則をxxx.html(xxxは数字)にする必要があります。」 とほほ。。。 それは「要件」だから初めに書かないと。。。 [ANo.7] の carData.html の中の |var no = (location.protocol == "file:") | ? location.hash.substring(1) | : location.search.substring(1); を | var no = location.href.match(/([^/\\]*).html$/)[1]; に変えるだけ。 ※ テストしてないので、ダメだったら補足してね。 以下ぼやき。 そもそも、 [ANo.10] のお礼から引用 「別のアプリケーションにて101を選択すると 指定フォルダ内にある101.htmlをサーチし 存在する場合は当該htmlを起動、無い場合はエラー用htmlを起動する」 のなら、 そのアプリケーションで直接 csv を読み込んで、 そのアプリケーションで入力した番号のデータを検索して そのアプリケーションで表示して始めて アプリケーションでしょ！
- fujillin
- ベストアンサー率61% (1594/2576)
#9です。 #7様が回答なさっているdocument.write()がよさそうですね。 （wreite()って使わないので、思いつきませんでした。）
お礼
別の方法をご提案頂きありがとうございました。 大変勉強になっております。 Getfilenameでファイル名を取得して、 document.write()でfilterに代入できれば、できそうな気もしているのですが、 記述方法がわからずうまくいきませんでした。
- dscripty
- ベストアンサー率51% (166/325)
[ANo.7] のお礼より引用 > 「ファイル名を指定して実行」から上記パスを起動しましたが、 > フィルタされず全ての項目が表示されてしまいます。 名前(O): [file:///ローカルフォルダ/carData.html#101] ではなくて、 名前(O): [iexplore "file:///ローカルフォルダ/carData.html#101"] で実行してみるといいかも。
お礼
大変お世話になっております。 ご回答いただきありがとうございます。 IEにて直接URL入力し[iexplore "file:///ローカルフォルダ/carData.html#101"]にてフィルタされることを確認できましたが、当方の要件で別のアプリケーションから起動する必要があり、 #101を指定できません。 別のアプリケーション仕様でファイル名を指定して起動するようになっているため ファイル名の命名規則をxxx.html(xxxは数字)にする必要があります。 101の場合は以下の動作になります。 事前に以下を指定フォルダに格納 100.html 101.html 102.html car.txt 別のアプリケーションにて101を選択すると 指定フォルダ内にある101.htmlをサーチし 存在する場合は当該htmlを起動、無い場合はエラー用htmlを起動する 当初の質問のとおり、htmlファイル名に3桁の数字”no”を入れておき、 scriptにてファイル名を取得してフィルタすることはできないでしょうか。
- fujillin
- ベストアンサー率61% (1594/2576)
#6です。 ＞頂いたソースにてテストしてみましたが、当方の環境では項目名のみ ＞表示され、no101のフィールドが読み出されませんでした。 その現象からみるとバインドされていないと、想像されます。 ＞データは質問に貼り付けたcat.txtを使用 もし、その文章の通りであるならば、ご質問文のデータは『car.txt』ですから表示されないでしょう。 とりあえず、filterの指定をはずした状態でinnerHTMLでobjectを生成してみてください。 それで、表示がされなければバインドされていないということです。 #6の回答では、"<"、">"をそのままコード化してしまいましたが、参照文字にしておいたほうが良いですね。 （これが、表示されない原因ではないと思いますが…） var obj = '\u003Cobject id="carData" classId="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"\u003E'; obj += '\u003Cparam name="DataURL" value="car.txt"\u003E'; obj += '\u003Cparam name="UseHeader" value="true"\u003E'; obj += '\u003C/object\u003E'; document.getElementById("data").innerHTML = obj; document.getElementById("test").setAttribute("dataSrc", "#carData"); その時の生成された要素を、innerHTMLで再確認してみると、バインドされていれば他のパラメータにもデフォルト値が追加された状態で取得できると思います。 そうでない場合は、バインドされていないということになるかと思います。 （objectをappendで追加したときは、そのままの内容が返されます） こちらの環境では、例えば以下のような結果になります。 （Windows XP SP3、 IE6.0.2.9） <OBJECT id=carData classid=clsid:333C7BC4-460F-11D0-BC04-0080C7055A83> <PARAM NAME="RowDelim" VALUE=" "> <PARAM NAME="FieldDelim" VALUE=","> <PARAM NAME="TextQualifier" VALUE='"'> <PARAM NAME="EscapeChar" VALUE=""> <PARAM NAME="UseHeader" VALUE="-1"> <PARAM NAME="SortAscending" VALUE="-1"> <PARAM NAME="SortColumn" VALUE=""> <PARAM NAME="FilterValue" VALUE=""> <PARAM NAME="FilterCriterion" VALUE="??"> <PARAM NAME="FilterColumn" VALUE=""> <PARAM NAME="CharSet" VALUE="shift_jis"> <PARAM NAME="Language" VALUE="ja"> <PARAM NAME="CaseSensitive" VALUE="-1"> <PARAM NAME="Sort" VALUE=""> <PARAM NAME="Filter" VALUE=""> <PARAM NAME="AppendData" VALUE="0"> <PARAM NAME="DataURL" VALUE="car.txt"> <PARAM NAME="ReadyState" VALUE="4"> </OBJECT> ＞また変数noに現在表示しているファイル名(拡張子無し)を代入する方法についても #4様が回答なさっている方法が、HTMLファイルが一つで済みますし手軽かと思います。 お考えの流れがわかりませんが、URLのsearch部で番号を受け渡して、location.searchで取得するという方法です。 違いは、データの読み込み方がajaxかデータバインドかの違いだけみたいなイメージでしょうか。
- dscripty
- ベストアンサー率51% (166/325)
[ANo.7] でことわりを入れ忘れたので追記。 [ANo.6] さんのコードをちょこっとだけ改変。
- dscripty
- ベストアンサー率51% (166/325)
「当方、htmlやjavascriptについての知識がほとんどなく、 参考先だけではとても作成できそうにありませんでした。」 ふむぅ。 本人が理解できないなら、いま XMLHttpRequest を勧めるのはやめておくね。 ローカルフォルダで確認するときは、 file:///ローカルフォルダ/carData.html#101 ウェブサーバのフォルダで確認するときは、 http://ウェブサーバ/のフォルダ/carData.html?101 でアクセスすれば表示できるとおもうから、試してみて？ ■carData.html■ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <title>sample</title> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> </head> <body> <table border="1" id="test" dataSrc="#carData"> <tr style="background-color:silver;"> <td>管理No</td> <td>車名</td> <td>メーカー</td> <td>色</td> <td>生産年</td> <td>価格</td> </tr> <tr> <td><span datafld="no"></span></td> <td><span datafld="name"></span></td> <td><span datafld="maker"></span></td> <td><span datafld="color"></span></td> <td><span datafld="year"></span></td> <td><span datafld="price"></span></td> </tr> </table> <div style="display:none;"> <script type="text/javascript"> var no = (location.protocol == "file:") ? location.hash.substring(1) : location.search.substring(1); document.write( '<object id="carData" CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">' + '<param name="DataURL" value="car.txt">' + '<param name="charset" value="shift_jis">' + '<param name="UseHeader" value="true">' + '<param name="Filter" value="no=' + no + '">' + '</object>'); </script> </div> </body> </html>
お礼
度々のご回答ありがとうございます。 何度もお手数お掛けしまして申し訳ありません。 >ローカルフォルダで確認するときは、 >file:///ローカルフォルダ/carData.html#101 ローカルフォルダに頂いたhtml(carData.html)とcar.txtを格納し 「ファイル名を指定して実行」から上記パスを起動しましたが、 フィルタされず全ての項目が表示されてしまいます。 htmlのファイル名を"101.html"とした場合に"101.htmlを直接IE6で起動し 101でフィルタされるようにしたいのですが可能でしょうか。
- fujillin
- ベストアンサー率61% (1594/2576)
＃3です。 ＞可能であればテストで使用されたソースを頂けないでしょうか。 表示のテストなので、対象のＮｏは決め打ちにしていますが、変数になっているので内容を変えればそのままでいけるかと思います。 以下で、テストしました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>sample</title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- window.onload = function(){ var no ="101"; // 変数noに表示する番号をセットする var obj = '<object id="carData" CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">'; obj += '<param name="DataURL" value="car.txt">'; obj += '<param name="UseHeader" value="true">'; obj += '<param name="filter" value="no=' + no + '"></object>'; document.getElementById("data").innerHTML = obj; document.getElementById("test").setAttribute("dataSrc", "#carData"); } //--> </script> </head> <body> <table border=1 id="test"> <tr bgcolor="silver"> <td>管理No</td> <td>車名</td> <td>メーカー</td> <td>色</td> <td>生産年</td> <td>価格</td> </tr> <tr> <td><span datafld="no"></span></td> <td><span datafld="name"></span></td> <td><span datafld="maker"></span></td> <td><span datafld="color"></span></td> <td><span datafld="year"></span></td> <td><span datafld="price"></span></td> </tr> </TABLE> <div id="data"></div> </body> </html>
お礼
ソースのご提供ありがとうございます。 頂いたソースにてテストしてみましたが、当方の環境では項目名のみ表示され、 no101のフィールドが読み出されませんでした。 上記ソースをコピペしスクリプトのコメントアウト削除 データは質問に貼り付けたcat.txtを使用。 ローカルフォルダにてIE6を使用して確認しました。 また変数noに現在表示しているファイル名(拡張子無し)を代入する方法についても ソースにてご教示頂けると助かります。
- dscripty
- ベストアンサー率51% (166/325)
訂正 [ANo.1] で XMLHttpRequest をすすめたので、そのやり方だ。 ↓ [ANo.1] で XMLHttpRequest をすすめたので、そのやり方だけ。
- dscripty
- ベストアンサー率51% (166/325)
[ANo.1] で XMLHttpRequest をすすめたので、そのやり方だ。 プログラムは済ませてあるから、あとはコード化してね。 > 指定フォルダのhtmlファイルが起動する（xxx.html） 指定フォルダのhtml の URL を | http://example.com/carinfo.html?xxx にすれば、location.search に ?xxx が入ってるから HTML ファイルは一つで済むよ。 XMLHttpRequest でファイルを読み込む方法は、 「MDN > Docs > AJAX > Getting Started」 → https://developer.mozilla.org/ja/AJAX/Getting_Started にかいてあるから参考にすれば簡単にかけるとおもう。 読み込んだ responseText を '\n' で split で行ごとの配列にして、 さらに、一行ごとに文字列を ',' で split して、 → https://developer.mozilla.org/ja/Core_JavaScript_1.5_Reference/Global_Objects/String/split "no:Int" と一行目(ヘッダ行)の配列の中の文字列を比較して、一致した配列の index で、各行のデータ[index] と location.search の 2文字目以降を比較すれば、表示する行が選択できるよ。 あとは、配列を "</td><td>" で join して、前に "<td>" と、後ろに "</td>" をくっつけて、 https://developer.mozilla.org/ja/JavaScript/Reference/Global_Objects/Array/join 作成した文字列を document.createElement('tr') して作成した要素に → http://www.w3.org/TR/DOM-Level-2-Core/ecma-script-binding.html innerHTML して → http://www.w3.org/TR/html5/apis-in-html-documents.html#innerhtml 最後に、作成した tr 要素を document.getElementsByTagName('table').item(0) へ appendChild して → http://www.w3.org/TR/DOM-Level-2-Core/ecma-script-binding.html おしまい。
お礼
ご回答ありがとうございます。 参考先までご教示頂いて恐縮です。 当方、htmlやjavascriptについての知識がほとんどなく、 参考先だけではとても作成できそうにありませんでした。 可能であれば、使用可能な状態でのソースをご提供頂けると大変助かります。
- fujillin
- ベストアンサー率61% (1594/2576)
他の方の回答のとおりajaxのほうが一般的かと思いますが… データバインドって使ったことがないし、ＩＥ専用なのでよくわからないのですが以下の説明を見て、多少いじってみましたが、どうも後からfilterを変えるのはうまくいかないみたい。 http://msdn.microsoft.com/ja-jp/library/cc392406.aspx それなので、次の方法を考えました。 1）データ量がさほどでもなければ、データを全部を読み込んでおいてフィルタリングだけjavascriptで行なう。 （表示/非表示などで制御すればよいだけなので比較的簡単） 2）データバインドをＨＴＭＬ読み込み後にセットする。 後からパラメータを変更しても、再読込みはしてくれないみたいなので、object要素全体を後から作成する方法を取りました。 createElementでobjectを生成してappendChildでセットしてもうまくバインドされないみたいですが、文字列でソースを作成してinnerHTMLでぶち込むと解釈してくれるみたいです。（一応、表示されました。） 以上、よくわかってませんが、ローカル環境でＩＥ6でテストしてみた結果です。
お礼
ご回答ありがとうございます。 データ量は200レコード*30フィールド程度になります。 大変不躾なお願いで恐縮なのですが、2)の表示できた方法について、 可能であればテストで使用されたソースを頂けないでしょうか。 当方もIE6のみのローカル環境での使用を想定しています。 本来であれば頂いたアドバイスで勉強すべきなのですが、 至急解決したい案件の為、どうか宜しくお願い致します。
- 1
- 2
関連するQ&A
- HTMLとXMLについて
仕事で困っています。 HTMLでテキストの内容表示するソースを作成しているのですが、IE10では表示できるのですが、Google Chrome,FireFoxでは表示できないのです。 <テキストの内容> name,maker,color,year:Int,price:Int アコード,ホンダ,白,92,800000 マークII,トヨタ,白,94,1500000 カムリ,トヨタ,黒,90,550000 サニー,ニッサン,シルバー,96,1200000 MPV,マツダ,赤,91,1350000 デミオ,マツダ,濃紺,95,1400000 シビック,ホンダ,青,93,1100000 シーマ,ニッサン,白,91,2100000 ゴルフ,フォルクスワーゲン,シルバー,94,1700000 シビック,ホンダ,シルバー,92,890000 カローラ,トヨタ,白,92,550000 アコード,ホンダ,濃紺,93,1200000 ステップワゴン,ホンダ,赤,96,1300000 ステップワゴン,ホンダ,白,97,1600000 スカイライン,ニッサン,シルバー,97,2000000 プリメーラ,ニッサン,白,93,650000 ユーノスロードスター,マツダ,青,94,1250000 カローラ,トヨタ,白,90,450000 ゴルフ,フォルクスワーゲン,黒,97,2100000 <HTMLの内容> <HTML> <HEAD> <TITLE>サンプル1</TITLE> </HEAD> <BODY> <P ALIGN=center> <SPAN ID="span1" DATASRC="#carData" DATAFLD="name"></SPAN><BR> <SPAN ID="span2" DATASRC="#carData" DATAFLD="maker"></SPAN><BR> <SPAN ID="span3" DATASRC="#carData" DATAFLD="color"></SPAN><BR> <SPAN ID="span4" DATASRC="#carData" DATAFLD="year"></SPAN><BR> <SPAN ID="span5" DATASRC="#carData" DATAFLD="price"></SPAN> </P> <!-- データソースオブジェクトの指定 --> <OBJECT ID=carData CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <PARAM NAME="DataURL" VALUE="car.txt"> <PARAM NAME="UseHeader" VALUE="true"> </OBJECT> </BODY> </HTML> なぜ表示できないのか分かりません。 どなたか教えてください。
- ベストアンサー
- その他([技術者向] コンピューター)
- JavaScriptの件で、質問させてください。
JavaScriptの件で、質問させてください。 どうしても解決できない問題がありますので、よろしくお願いします。 やりたいこと：csvファイル(日本語カラム名)の内容をブラウザに表示させたい。 状況：JavaScript 、html初心者です。 JavaScript内でdocument.writeを使用してhtml文を書いています。 csvファイルのカラム名が日本語の場合、ブラウザへの表示に失敗※します。 ※カラム名だけ表示されて実際データが表示されない。 下記の例の場合、csvファイル内のカラム名を"日時"、"B"、"C"にしました。 実行するとデータは"B"、"C"の部分だけ表示されて、"日時"の部分は空白になります。 尚、csvファイルの"日時"を"A"にして、ソースも"A"を読むように変更すると データは正常にブラウザに表示されます。 ※JavaScriptをやめて、htmlだけで記述すると日本語カラム名でも 正常に表示されます。 教えていただきたいこと： ・ソース抜粋部分に記述ミスはありますでしょうか？ ・JavaScript？document.write？の記述制限でしょうか？ ・カラム名をアルファベットにすると正常に表示されるので、 不具合の原因はソース抜粋部分にあると思うのですが、 その他の部分でエラー原因となりうる場所はありますでしょうか？ ソース一部抜粋 document.open(); document.write("<object id='ID1' classid='clsid:333C7BC4-460F-11D0-BC04-0080C7055A83'>"); document.write("<param name='DataURL' value='test.csv'>"); document.write("<param name='UseHeader' value='true'>"); document.write("</object>"); document.write("<table datasrc='#ID1' border=1>"); document.write("<thead><tr>"); document.write("<th>日時</th>"); document.write("<th>場所</th>"); document.write("<th>参加人数</th>"); document.write("</tr></thead>"); document.write("<tr>"); // document.write("<td><span datafld='A'></span></td>"); document.write('<td><span datafld='日時'></span></td>'); document.write('<td><span datafld='B'></span></td>'); document.write("<td><span datafld='C'></span></td>"); document.write("</tr>"); document.close(); 質問すること自体も初めてなので、至らない点も多々あると思いますが よろしくお願いします。
- ベストアンサー
- JavaScript
- CSV形式のExcelファイルをhtmlで表示
訳あって以下のソースを使わなければなりません。 しかし、これだけではエラーになってしまいますよね？ 私は初心者なので、その他何を加えれば実行できるのか、 その基礎的な部分がまったくわかりません。 以下がそのソースです。list1というExcelのデータを表示するものです。 <HTML> <HEAD> <TITLE> </HEAD> <OBJECT CLASSID="clasid:333c7bc4-460f11d0-bc04-0080c7055a83"ID=list> <PARAM NAME="CharSet"VALUE="shift-jis"> <PARAM NAME="DataURL"VALUE="list1.txt"> <PARAM NAME="UseHeader"VALUE="true"> </OBJECT> <TABLE ID="oTable" DATASRC=#list BORDER="2" BGCOLOR="#eeeeff"> <THEAD> <TR> <TD BGCOLOR="#ddddff"><B>品番</B></TD> <TD BGCOLOR="#ddddff"><B><CENTER>品名</CENTER></B></TD> <TD BGCOLOR="#ddddff"><B>カテゴリ</B></TD> <TD BGCOLOR="#ddddff"><B>定価</B></TD> <TD BGCOLOR="#ddddff"><B>特価</B></TD> <TD BGCOLOR="#ddddff"><B>在庫</B></TD> </TR> </THEAD> <TBODY> <TR> <TD><DIV DATAFLD=no ALIGN=right></DIV></TD> <TD><DIV DATAFLD=name></DIV></TD> <TD><DIV DATAFLD=shurui></DIV></TD> <TD><DIV DATAFLD=teika ALIGN=right></DIV></TD> <TD><DIV DATAFLD=tokka ALIGN=right></DIV></TD> <TD><DIV DATAFLD=zaiko ALIGN=right></DIV></TD> </TR> </TBODY> </TABLE> </HTML> どうかお願いしますm(__)m ちなみにエラーメッセージは <object>タグにwidht属性がありません <param>タグが<applet></applet>の外にあります です。 <applet>に何を書けばいいのかわかりません。 このソースの場合、データベースのデータを表示したいだけでもjavaファイルを作らなければならないということでしょうか？ 無知でごめんなさいm(__)m 上記のソースだけ渡されてそれを実行しなければならないので、その他のことがまったくわからないのです。
- ベストアンサー
- ホームページ作成ソフト
- 分割したCSVを1つに結合させ、データバインドするには
分割したCSVデータをデータバインド時に1つにして利用したい。 【CSVファイル名】 現状：data.csv（3MB） 希望：data1.csv data2.csv data3.csv data4.csv data5.csv (各450KB) 【現行のスクリプト】 <script language="JavaScript"> function filterRec() { var check_cond = input1.value + input2.value + input3.value + input4.value + input5.value if(check_cond != "") { var cond1 = "id=" + "*" + input1.value + "*" var cond2 = "photo=" + "*" + input2.value + "*" var cond3 = "name=" + "*" + input3.value + "*" var cond4 = "setumei=" + "*" + input4.value + "*" var cond5 = "hit=" + "*" + input5.value + "*" var cond_all = cond1 + "&" + cond2 + "&" + cond3 + "&" + cond4 + "&" + cond5 JavaScriptData.object.Filter = cond_all JavaScriptData.Reset() checkCount() } } function filterReset() { input1.value = "" input2.value = "" input3.value = "" input4.value = "" input5.value = "" JavaScriptData.object.Filter = "" JavaScriptData.Reset() checkCount() } function checkTotal() { span1.innerText = JavaScriptData.recordset.recordCount span2.innerText = JavaScriptData.recordset.recordCount } function checkCount() { span1.innerText = JavaScriptData.recordset.recordCount } </script> </head> <body onload="checkTotal()"> <center><button onclick="table1.previousPage()">前の検索結果に戻る<</button><button onclick="table1.nextPage()">>次の検索結果に進む</button><button onclick="filterRec()">キーワードで絞込を実行</button><button onclick="filterReset()">絞込を解除</button> <font size="2">全<span id="span2"></span>件の中から<font color="#ff0000"><span id="span1"></span></font>件が該当しました。</font> <!--見出し設定はじまり--> <table id="table1" style="FONT-SIZE: 9pt" datasrc="#JavaScriptData" width="850" dataPageSize="5"><thead> <tr style="COLOR: white; BACKGROUND-COLOR: #d90005"> <td align="center"><strong>番号</strong><br><input id="input1" style="FONT-SIZE: 8pt" size="10"></input><br><br><br></td> <td align="center"><strong>画像</strong><br><input id="input2" style="FONT-SIZE: 8pt" size="10"><br><br><br></td> <td align="center"><strong>名称</strong><br><input id="input3" style="FONT-SIZE: 8pt" size="40"></input><br></td> <td align="center"><strong>説明</strong><br><input id="input4" style="FONT-SIZE: 8pt" size="50"></input></td> <td align="center"><strong>HIT<input id="input5" style="FONT-SIZE: 8pt" size="15"></input></td></tr></thead> <!--見出し設定おわり--> <tbody><tr style="BACKGROUND-COLOR: wheat"><td align="center"><span datafld="id" datasrc="#JavaScriptData"></span></td> <td><datasrc="#JavaScriptData"><img datafld="photo" src="#JavaScriptData"></a></td> <td><span datafld="name"></span></td> <td><span datafld="setumei"></span></td> <td><span datafld="hit"></span></td></tr></tbody></table></center> <!-- データベース用オブジェクトの指定 --> <object id="JavaScriptData" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"><param name="RowDelim" value=" "><param name="FieldDelim" value=","><param name="TextQualifier" value='"'><param name="EscapeChar" value=""><param name="UseHeader" value="-1"><param name="SortAscending" value="-1"><param name="SortColumn" value=""><param name="FilterValue" value=""><param name="FilterCriterion" value="??"><param name="FilterColumn" value=""><param name="CharSet" value=""><param name="Language" value="ja"><param name="CaseSensitive" value="-1"><param name="Sort" value=""><param name="Filter" value=""><param name="AppendData" value="0"><param name="DataURL" value="data.csv"><param name="ReadyState" value="4"></object> 【経緯】 1 Ajaxを思考錯誤 (挫折) 2 <param name="AppendData" value="0">を編集 (挫折) 最後の手段として熟知者の知恵をお借りしたいと思います。
- 締切済み
- JavaScript
- javascriptで計算した結果の表示について
CSVファイルの表をhtmlで表示するものです。 そこから二つのデータ（価格・特価）を使って計算した結果（割引率）を新たに表に加えたいのですが、そのやり方がわかりません。 以下のリストに<BODY onLoad="CalcDiscountRate"()>を加える場合はどこに加えればいいでしょうか？ また、他にやり方がある場合はお願いします。 他にも間違っている箇所があった場合はお願いします。 特に<script>内は自信がありません。 実行すると割引率が空欄になるようになってます。 <HTML> <HEAD> <TITLE>A</TITLE> <SCRIPT LANGUAGE="JavaScript"> function CalcDiscountRate(){ for(i=0;i<document.all.oTable.tBodies.length;i++){ document.all.oTable.tBodies[i].rows[0].cells[4].innerText = Math.floor((1-document.all.oTable.tBodies[i].rows[0].cells[5]. innerText/ document.all.oTable.tBodies[i].rows[0].cells[3].innerText) *100)+"%" } } </SCRIPT> </HEAD> <OBJECT classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83" ID="list"> <PARAM NAME="CharSet" VALUE="shift-jis"> <PARAM NAME="DataURL" VALUE="list1.txt"> <PARAM NAME="UseHeader" VALUE="true"> </OBJECT> <BODY> <TABLE ID="oTable" DATASRC=#list BORDER=1> <THEAD> <STYLE TYPE="text/css"> .highlight {font-weight : hold;background : #ffdddd} </STYLE> <TR> <TD BGCOLOR="#ddddff"><B>品番</B></TD> <TD BGCOLOR="#ddddff"><B><CENTER>品名</CENTER></B></TD> <TD BGCOLOR="#ddddff"><B>カテゴリ</B></TD> <TD BGCOLOR="#ddddff"><B>定価</B></TD> <TD BGCOLOR="#ddddff"><B>割引率</B></TD> <TD BGCOLOR="#ddddff"><B>特価</B></TD> <TD BGCOLOR="#ddddff"><B>在庫</B></TD> </TR> </THEAD> <TBODY> <TR BGCOLOR="#ffffbb"> <TD><DIV DATAFLD="no" ALIGN=CENTER></DIV></TD> <TD><DIV DATAFLD="name" CLASS="highlight"></DIV></TD> <TD><DIV DATAFLD="shurui"></DIV></TD> <TD><DIV DATAFLD="teika" ALIGN="right"></DIV></TD> <TD BGCOLOR="ffe0ff"></TD> <TD><DIV DATAFLD="tokka" ALIGN="right" CLASS="highlight"></DIV></TD> <TD><DIV DATAFLD="zaiko" ALIGN="right"></DIV></TD> </TR> </TBODY> </TABLE> </BODY> </HTML> どうかよろしくお願いしますm(__)m 以下余談 このソースはあるテキストを見て写したものです。 なのでだいたいはあっていると思いますが、テキストは数ページ分をスキャンした中途半端なもので、ソースも途切れ途切れで提示されているため初心者の私にはそれをどこに書いていいかが解らないのです。 <BODY onLoad="CalcDiscountRate"()>を使いたいのもそういった理由です。
- 締切済み
- ホームページ作成ソフト
- ＣＳＶファイルのデータを元に別ファイルを開く
データバインドという機能を使用し、ＣＳＶファイルをテーブル形式で表示するＨＴＭＬ文書を作成しました。 項目［FILENAME］の代わりに画像を表示しクリックすると、他のパソコンの共有フォルダに 格納されているＥＸＣＥＬファイル（ファイル名＝FILENAME）が開くという機能をつけたのですが 「onclick=」で処理を呼び出す際、項目［FILENAME］の値をVbscriptの処理に渡す方法が どうしてもわからず悩んでいます。 （プログラムに直接ファイル名を記述すると正常にファイルを開くことができます） どなたかご存じの方がいらっしゃいましたら、何卒ご教授下さいますようよろしくお願いいたします。 「master.csv」 NO,USER,FILENAME 001,山本,伝票0526 001,田中,伝票0526 001,小川,伝票0526 「index.html」 <object id="ID1" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DB" value="master.csv"> </object> <table datasrc="#ID1" border=1> <tr> <td><span datafld="NO"></span></td> <td><span datafld="USER"></span></td> <td><span datafld="FILENAME"></span></td> <a datafld="FILENAME" onclick=CallXLS("伝票0526")> <img src="imgs/go.gif" BORDER="0"> </a></td> </tr> </table> <script language=VBScript> Function CallXLS(DENPYO) Set objExcel = CreateObject("Excel.Application") objExcel.Visible = True Set objWorkbook = objExcel.Workbooks.Open("\\ＩＰアドレス\経理\会計\" & DENPYO & ".xls") End Function </script>
- ベストアンサー
- HTML
- データバインドで生成したテーブルの行の色を変えたい
データバインドで生成したテーブルの各行のセルの色を 各データが持っている色で表示したいと考えています。 以下のようなcsvとhtmlを作ってみたところ yamadaのセルをred、suzukiのセルをyellow、kondoのセルをblue と表示するところまではうまくいったのですが 次ページのtanakaがgreenではなくてredのままになってしまいます。 何か良い方法をご存知の方がいらっしゃいましたら教えてください！ よろしくお願いいたします。 <a.csv> ----------------- name,color yamada,red suzuki,yellow kondo,blue tanaka,green ito,aqua saito,red nakanisi,yellow ota,blue isikawa,green naito,aqua nisino,red azuma,yellow <a.html> ----------------- <script type="text/javascript"> <!-- function chStyle() { for(i=0; i<3; i++){ gyo0[i].style.backgroundColor = td_color[i].value; } } --> </script> <body onload="chStyle();"> <TABLE DATASRC="#ID1" BORDER=1 DATAPAGESIZE=3 ID="table1"> <TR> <TD id="gyo0"><SPAN DATAFLD="color"></SPAN></TD> <TD> <SPAN DATAFLD="name"></SPAN> <INPUT TYPE="hidden"datasrc="#ID1" DATAFLD="color" id="td_color"> </TD> </TR> </TABLE> <BUTTON onclick="table1.previousPage()">BACK</BUTTON> <BUTTON onclick="table1.nextPage()">NEXT</BUTTON> <OBJECT classid="clsid:333c7bc4-460f-11d0-bc04-0080c7055a83" id="ID1"> <PARAM name="CharSet" value="shift-jis"> <PARAM name="DataURL" value="a.csv"> <PARAM name="UseHeader" value="true"> </OBJECT> </body> </html>
- ベストアンサー
- JavaScript
- ,区切りでテキストで書かれたテキスト文書に文字列を書き加える（データバインド）
データバインドで使用するテキストデータの内容が以下のように書かれています。 1,aaa.ne.jp/~xxx/ 2,bbb.co.jp/ 3,ccc.com/ ・ ・ ・ ・ このような場合、全てのcolumn2の前に同じ文字列(http://)を追加して表示するようなことはJavaScriptでできますでしょうか？ 表示箇所は現在 <TABLE DATASRC="#Data"> <TBODY> <TR> <TD> <SPAN DATAFLD="column1"></SPAN> </TD> <TD> <A DATAFLD="column2" target="_blank"><SPAN DATAFLD="column2"></SPAN></A> </TD> </TR> </TBODY> </TABLE> といった感じです。 読み込むデータ側には「http://」が書かれていないため当然リンクしてくれません。 テキスト内のデータがかなり多いため、できれば読み込むデータ側のcolumn2にhttp://を付けるという処理は避けたいのです。 どなたかおわかりになる方、ご教授願います。
- ベストアンサー
- JavaScript
- JavaScriptとJSPの連携
JavaScriptのメソッドで受け取った値を JSPのスクリプトレットで配列番号として使いたいのですが 認識してくれていないようです・・・。 これは不可能なんでしょうか？ function setKey(no){ int colNo = parseInt(no); <% HashMap keys = （JSP部分で取得済みのHashMap）[colNo]; %> } ====== <TABLE><TR> <% for(int i; i < 配列.length; i++){ %> <TD> <INPUT TYPE="button" NAME="btnSet<%= i %>" VALUE="セット" onClick="setKey('<%= i %>');" > ・・・・・ ・・・・・ </TD></TR> <% } %> <TABLE> こうすると、[colNo]を認識してくれないようなのですが・・・。
- ベストアンサー
- Java
- JavaScriptの読み込み順
下記コードを実行すると、プルダウンメニューに値が入る前にボタンがクリックされてしまいます。 どのようなコードを書けば正常に動作するのでしょうか。 ■html内 <html> <head> <title>SCT</title> <script type="text/javascript"> onload = function() { var d = new Date() ; d.setTime((new Date).getTime()) ; newOption = document.createElement('option') ; newOption.value = newOption.innerHTML = d.getFullYear()-1 ; document.getElementById('year').appendChild(newOption) ; newOption = document.createElement('option') ; newOption.value = newOption.innerHTML = d.getMonth()+1 ; document.getElementById('month').appendChild(newOption) ; newOption = document.createElement('option') ; newOption.value = newOption.innerHTML = d.getDate() ; document.getElementById('day').appendChild(newOption) ; } </script> <script type="text/javascript" language="JavaScript" src="./file.js"> </script> </head> <form NAME="Myfm" method="post" action="☆☆URL☆☆"> <body onLoad="yobi()"> <table border="0"> <tr> <td> <select name="startyear" id="year"> </select> </td> <td>年</td> <td> <select name="startmonth" id="month"> </select> </td> <td>月</td> <td> <select name="startday" id="day"> </select> </td> <td>日</td> </tr> <tr> <td> <select name="endyear"> <option value=201>2011 </select> </td> <td>年</td> <td> <select name="endmonth"> <option value=8>8 </select> </td> <td>月</td> <td> <select name="endday"> <option value=1>1 </select> </td> <td>日</td> </tr> <tr> <td><input type="submit" value="集計" NAME="mybut"> </td> </tr> </table> </body> </form> </html> ■file.js内 function yobi(){ document.Myfm.submit(); }
- ベストアンサー
- JavaScript
お礼
上記何れでもフィルタ動作することが確認できました。 こちらの説明が至らず何度も修正頂きご迷惑お掛けいたしました。 本当にありがとうございました！ ベストアンサーにさせていただきます。 fujillinさんもありがとうございました。