![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?c9bd177)
csvファイルの内容を絞り込んで表示させようと思っているのですが、うまくいきません。考えて色々やって見たのですが出来ないので、どなたかアドバイスを頂けないでしょうか。
<form name="myFORM">
人数を選択してください
<select name="myNinzuu">
<option selected value=1>1人
<option value=2>2人
<option value=3>3人
</select>
<input type="button" value="データを表示" onClick="window.open('data.html','_blank')" />
</form>
------------------data.html------------------------
<html>
<script type="text/javascript"><!--
var Sanka = new Array[iti,ni,san];
var Index = document.myFORM.myNinzuu.value;
if(window.opener.myFORM.Ninzuu.value){
document.write('<object id="myDatabase" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">');
document.write('<param name="DataURL" value="data.csv">');
document.write('<param name="UseHeader" value="true">');
document.write('</object>');
}
--></script>
<body>
<table datasrc="#myDatabase" id="myTBL">
<tr>
<td><DIV datafld="ikisaki"></DIV></td>
<td><DIV datafld="Sanka[Index]"></DIV></td>
</tr>
</table>
</body></html>
------------------csvファイル------------------------
ikisaki,iti,ni,san,
東京,28000,54000,75000,
名古屋、15000,28000,40000,
広島、18000,23000,47000,
所々消したので文法的に大間違いがあるかもしれませんが・・・
csvファイルのx軸を絞り込みたいのです。
まだまだ勉強不足でわかってないところが多く、根本的に間違っているかもしれませんが、その辺の指摘も含めてお願いします。
No.4ベストアンサー
- 回答日時:
こちらの認識不足でした。
すみません。アプレットクラスは使用していませんでした。
データバインド機能を使用してCSVファイルからデータを読み込み、
やり方でしたね。
やっと意味がわかりました。
(1)var Sanka = new Array[iti,ni,san];
の必要ないです。削除してかまいません。
(2)<td><DIV datafld="Sanka[Index]"></DIV></td>を変更します。
<script type="text/javascript">
if(window.opener.myFORM.myNinzuu.value == "1"){
document.write('<td><DIV datafld="iti"></DIV></td>');
}
if(window.opener.myFORM.myNinzuu.value == "2"){
document.write('<td><DIV datafld="ni"></DIV></td>');
}
if(window.opener.myFORM.myNinzuu.value == "3"){
document.write('<td><DIV datafld="san"></DIV></td>');
}
</script>
davosukeさん毎回の詳しい説明有難うございます。
今回の回答でやっと望んでいたことができました。
if文での条件分岐は試していたのですが、条件の内容の記述がうまい事いかずにず~っと悩んでいました。
davosukeさんの親切な説明のおかげでとてもよくわかりました。
本当に有難うございました。
No.3
- 回答日時:
説明が不足しているようなので補足して実行しました。
【疑問点】
・ShowTable()はいつ呼ばれるのですか??
(onLoad時に呼ばれると仮定して実行しました。)
data.htmlの<body>を<body onLoad="ShowTable()">に変更。
・objDataBindとは、どこから取得しましたか??
(アプレットクラスから提供されるもの??)
【実行結果】
data.htmlにmyFORMというファームが無いからです。
呼びもとのhtmlを参照する必要があります。
以下のように変更してください
var Index = document.myFORM.myNinzuu.value;
↓
var Index = window.opener.myFORM.myNinzuu.value;
まず、これだけ修正して実行してみてください。
それでも駄目な時は、アプレットクラスのソースをご提供してください。
【質問の回答】
アプレットクラスソースとは、
アプレットクラスのコンパイル前のソースを指します。
アプレットクラスとは、Web上で動くJavaプログラムです。
davosukeさん、度々の回答ありがとうございます。
加えて毎度の説明不足と、私の知識不足でご迷惑をおかけしてしまってすいません。
情けない話ですが、ソース自体が私自身で組上げた物ではなく、色々な方々の公開ソースを組み合わせた物なので、davosukeさんが今回の回答で疑問に思われた、
>・ShowTable()はいつ呼ばれるのですか??
>・objDataBindとは、どこから取得しましたか??
の返事が出来ません。
私自身わかってないのですが、「できたからいいか」という感じでした。
質問した時のソースを全て開示しますので、いけないと思われるところの指摘と、こうした方が良いというアドバイスをいただけないでしょうか。
<body>
<form name="myFORM">
行き先を入力してください
<input type="text" name="myTabisaki"><br>
人数を選択してください
<select name="myNinzuu">
<option selected value=1>1人
<option value=2>2人
<option value=3>3人
</select>
<input type="button" value="データを表示" onClick="window.open('data.html','_blank')" /></form>
</form>
</body></html>
------------------data.html------------------------
<html>
<script type="text/javascript"><!--
function ShowTable()
{
//selectにて選択された値を取得します。
var nIndex;
var Sanka = new Array[iti,ni,san];
var Index = window.opener.myFORM.myNinzuu.value;
//データにフィルタをかけます。
objDataBind.FilterValue=nIndex;
objDataBind.FilterColumn="ikisaki";
objDataBind.FilterCriterion="=";
objDataBind.Reset();
}
if(window.opener.myFORM.myTabisaki.value){
document.write('<object id="myDatabase" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">');
document.write('<param name="DataURL" value="data.csv">');
document.write('<param name="UseHeader" value="true">');
document.write('<param name="Filter" value="ikisaki=' + window.opener.myFORM.myTabisaki.value + '">');
document.write('</object>');
}
--></script>
-----この後は質問時の通りです。
よろしくお願いします。
No.2
- 回答日時:
(1)window.openからwindow.showModalDialogに変えないと、
人数セレクトボックスの情報が起動したウィンドウから
取得できません。
(2)data.htmlにて
var Sanka = new Array[iti,ni,san];
これが必要かどうかは
document.write('<object id="myDatabase" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">');
document.write('<param name="DataURL" value="data.csv">');
document.write('<param name="UseHeader" value="true">');
document.write('</object>');
のアプレットクラスソースをご提供下さい。
以下、サンプルソース
<html>
<script type="text/javascript"><!--
function openDialog(){
//ダイアログに渡す引数配列を定義
var args = new Array();
//人数セレクトボックスの値を取得
args[0] = document.myFORM.myNinzuu.value;
//ダイアログ起動
window.showModalDialog("data.html",args);
}
--></script>
<body>
<form name="myFORM">
人数を選択してください
<select name="myNinzuu">
<option selected value=1>1人
<option value=2>2人
<option value=3>3人
</select>
<input type="button" value="データを表示" onClick="openDialog()" />
</form>
</body>
</html>
------------------data.html------------------------
<html>
<script type="text/javascript"><!--
var args = window.dialogArguments; //追加
//一応コメント!!
//var Sanka = new Array[iti,ni,san];
//var Index = document.myFORM.myNinzuu.value;
var Index = args[0]; //変更
if(window.opener.myFORM.Ninzuu.value){
document.write('<object id="myDatabase" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">');
document.write('<param name="DataURL" value="data.csv">');
document.write('<param name="UseHeader" value="true">');
document.write('</object>');
}
--></script>
<body>
<table datasrc="#myDatabase" id="myTBL">
<tr>
<td><DIV datafld="ikisaki"></DIV></td>
<!-- アプレットにSankaが定義されていれば、取得可能だが・・・・ -->
<td><DIV datafld="Sanka[Index]"></DIV></td>
</tr>
</table>
</body></html>
更なる回答ありがとうございます。
実は質問したセレクトボックスでの絞込みと、テキストボックスへの入力での絞り込みをやっていて、テキストボックスでの絞り込みはうまくいっていたので質問には省いてました。
実際はこんな感じです。
<form name="myFORM">
行き先を入力してください
<input type="text" name="myTabisaki"><br>
人数を選択してください
<select name="myNinzuu">
<option selected value=1>1人
<option value=2>2人
<option value=3>3人
</select>
<input type="button" value="データを表示" onClick="window.open('data.html','_blank')" />
</form>
------------------data.html------------------------
<script type="text/javascript"><!--
function ShowTable()
{
//selectにて選択された値を取得します。
var nIndex;
var Sanka = new Array[iti,ni,san];
var Index = document.myFORM.myNinzuu.value;
//データにフィルタをかけます。
objDataBind.FilterValue=nIndex;
objDataBind.FilterColumn="ikisaki";
objDataBind.FilterCriterion="=";
objDataBind.Reset();
}
if(window.opener.myFORM.myTabisaki.value){
document.write('<object id="myDatabase" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">');
document.write('<param name="DataURL" value="data.csv">');
document.write('<param name="UseHeader" value="true">');
document.write('<param name="Filter" value="ikisaki=' + window.opener.myFORM.myTabisaki.value + '">');
document.write('</object>');
}
--></script>
<body>
<table datasrc="#myDatabase" id="myTBL">
<tr>
<td><DIV datafld="ikisaki"></DIV></td>
<td><DIV datafld="Sanka[Index]"></DIV></td>
</tr>
</table>
</body></html>
davosukeさんの回答を見てアプレットクラスソースって何?っていうぐらいの知識しかないので、とても参考になります。
説明をきちんとしてなかったので、どんどんご迷惑をおかけしてしまってすいません。
かなり停滞してとても困ってます。どうかよろしくお願いします。
No.1
- 回答日時:
>csvファイルの内容を絞り込んで表示させようと思っているのですが、
>うまくいきません。
とありますが、表示したら、どのようになりますか??
(1)エラーメッセージが出力しまたか??
(2)画面がだんまりになりましたか?
(3)画面遷移するまでにおかしくなっていますか??
もう少し詳細にうまくいかない状況をお願いします。
返答ありがとうございます。
質問の説明不足で内容がよくわからなかったようですね。
ごめんなさい。
実行結果は'東京'、'名古屋'、'福岡'のikisakiの列は表示されるのですが、iti、ni、sanの数値の列は空白です。
どうも
<td><DIV datafld="Sanka[Index]"></DIV></td>
でSanka[Index]をiti、ni、sanのどれとも認識されないみたいです。
変数宣言の
var Sanka = new Array[iti,ni,san];
var Index = document.myFORM.myNinzuu.value;
の時点ですでに間違っているのでしょうか・・・
そんな事すらわかっていませんがよろしくお願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript プログラムがうまく動きませんレビューお願いします 1 2022/07/10 05:08
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
追加ボタンを押した際に ok ボ...
-
ボタンかリンクをクリックする...
-
クリックさせたいが、click()が...
-
onchangeイベントを強制的に発...
-
javaScriptの変数をJavaの変数...
-
formのfileの値をhiddenでも持...
-
JavaScript text内にある文字の...
-
インラインフレームから親ウィ...
-
setIntervalについて
-
addEventListenerについて
-
JavaScriptのfileオブジェクト...
-
コマンドボタンでショットカッ...
-
onclickが動作しない
-
マウスカーソルの変更
-
データを別のhtmlページに受け...
-
プルダウンで選択したページに...
-
JavaScriptで コードを変数で...
-
if構文
-
onClickがinput type="image"だ...
-
<option>を動的に変更
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
クリックさせたいが、click()が...
-
onclickが動作しない
-
追加ボタンを押した際に ok ボ...
-
javaScriptの変数をJavaの変数...
-
innerHTML内では改行は禁止?
-
formのfileの値をhiddenでも持...
-
ボタンかリンクをクリックする...
-
JavaScriptのfileオブジェクト...
-
onClickがinput type="image"だ...
-
javascriptで作成されたテーブ...
-
開いた子ウィンドウにあるボタ...
-
ポップアップブロックにならな...
-
コードレビューをお願いします。
-
ボタンをクリックするとテキス...
-
VB.NETで<Input>タグ、<text...
-
テキストフィールド未入力の場...
-
URL 判定
-
ボタンをクリックして文字を置...
-
JQueryでfunctionに引数としてI...
おすすめ情報