- 締切済み
JavaScriptで特定csvファイルを読み込み表示させるには？
JavaScript初心者です。 現在WEBページで路線検索システムを作成しています。 路線名がセットされたselectボックスがあり、路線が選択されると（onchange）その路線に属する駅名をデータとして持ったselectボックスを生成する、というscriptを作る予定です。 駅名のリストはcsvファイルで持っており、選択された路線でそのファイルを限定し、読み込み駅名を表示させたいのですが、それは可能でしょうか？ 大変困っております。 どなたかお力をお貸しください…
- aki_aki1002
- お礼率14% (1/7)
- JavaScript
- 回答数4
- ありがとう数2
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- todo36
- ベストアンサー率58% (728/1234)
DataURL
- todo36
- ベストアンサー率58% (728/1234)
なるほど... データバインドで動的に<Select>を作れますね。 --- <object id="Data1" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DataURL" value="data.csv"> </object> <script type="text/javascript"> function func(myform) { for(i = myform.Slct2.options.length - 1; i >= 0; i--){ myform.Slct2.options.remove(i); } Data1.object.Filter = myform.Slct1.options[myform.Slct1.selectedIndex].value; Data1.Reset(); var rs = Data1.recordset; while (! rs.EOF){ var elm = document.createElement("OPTION"); elm.text = rs.fields(1).value; myform.Slct2.add(elm); rs.MoveNext(); } } </script> <form> <select name="Slct1" onChange="func(this.form)"> <option value=""> <option value="Column1=A線">A線 <option value="Column1=B線">B線 </select> <select name="Slct2"> </select> </form>
- snuffy
- ベストアンサー率53% (33/62)
SELECTメニューを動的に表示することは可能です。 ----------------------- <html> <head> <script type="text/vbscript"> Sub test() document.myform.slct.style.display = "" Set opt1 = document.createElement("OPTION") document.myform.slct.Add (opt1) opt1.Text ="A駅" Set opt2 = document.createElement("OPTION") document.myform.slct.Add (opt2) opt2.Text ="B駅" End Sub </script> </head> <body> <form name="myform"> <input type="button" value="セレクトボタン出現！" onclick="test()"> <select name="slct" style="display:none"> </select> </form> </body> </html> ------------------------------- 上記の方法と、#1 の方の方法を組み合わせれば、ご希望の仕様を満たすHTMLが出来ると思います。 頑張って下さい。
- todo36
- ベストアンサー率58% (728/1234)
IE限定ならデータバインドという手があります。 同じようなことを考えましたが、<select>を作るのは 無理だと思っています。(別窓なら可能) ラジオボタンならこんな感じ。 --- "data.csv" --- "A線","a駅" "A線","b駅" "B線","c駅" "B線","d駅" --- "test.html" --- <object id="Data1" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DataURL" value="data.csv"> </object> <select onClick="Data1.object.Filter = this.options[this.selectedIndex].value; Data1.Reset();"> <option value=""> <option value="Column1=A線">A線 <option value="Column1=B線">B線 </select> <table datasrc="#Data1"> <tr><td> <input type=radio name=radio1><span datafld="Column2"></span> </td></tr> </table> ---------
補足
ありがとうございます。 スクリプト自体初心者なものでソースを理解するのに時間がかかってしまいました(^^; 上記の方法だと、ファイルは「data.csv」1つのみしか指定できないのでしょうか？ 駅名のファイルは、路線分（複数）あるのでファイルを1つに特定できません… 何か良い方法はありませんでしょうか… よろしくお願いします。