2つのプルダウンの連動に関して
javascript の話になってしまうかと思われますが、教えて下さい。
2つのプルダウンを連動させたいと考えていますが、単純に決められた項目を初期値として
設定するようなプルダウンであれば問題なくできますが、テーブルから取得したデータをプルダウン
にセットした後に制御を掛けたいと考えています。
以下のようなソースを活用できないか?と考えていますが、どのような方法があるでしょうか。。。。
《活用ソース》
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE=JavaScript>
<!--
function funcSubmit() {
if (document.formMain.pref.selectedIndex == 0 && document.formMain.city.selectedIndex == 0) {
window.alert("都道府県と市町村を選択してください");
return false;
} else {
return true;
}
}
function funcMain(b) {
if (document.formMain.pref.selectedIndex == 0) {
document.formMain.city.length = 1;
document.formMain.city.selectedIndex = 0;
} else {
if (b) {
document.formMain.city.length = 1;
document.formMain.city.selectedIndex = 0;
}
var city = cities[document.formMain.pref.selectedIndex - 1];
document.formMain.city.length = city.length + 1;
for (var i = 0; i < city.length; i++) {
document.formMain.city.options[i + 1].value = i;
document.formMain.city.options[i + 1].text = city[i];
}
}
}
↓↓↓↓ ※これらの情報をテーブルから取得したデータとしたい。↓↓↓↓
var prefs = new Array("東京都", "大阪府", "愛知県", "千葉県");
var cities = new Array();
cities[0] = new Array("小平市", "町田市", "三鷹市");
cities[1] = new Array("大阪市", "豊中市");
cities[2] = new Array("名古屋市", "半田市");
cities[3] = new Array("千葉市", "市川市", "柏市");
// -->
</SCRIPT>
</HEAD>
<BODY onLoad="funcMain(false)">
<FORM NAME=formMain METHOD=POST ACTION=result.asp onSubmit="return funcSubmit()">
<SELECT NAME="pref" onChange="funcMain(true)">
<OPTION VALUE="" SELECTED>(都道府県を選択してください)
<OPTION VALUE="0">東京都
<OPTION VALUE="1">大阪府
<OPTION VALUE="2">愛知県
<OPTION VALUE="3">千葉県
</SELECT>
<SELECT NAME="city">
<OPTION VALUE="" SELECTED>(市町村を選択してください)
<OPTION VALUE="">
<OPTION VALUE="">
<OPTION VALUE="">
<OPTION VALUE="">
<OPTION VALUE="">
<OPTION VALUE="">
<OPTION VALUE="">
</SELECT>
<INPUT TYPE=submit VALUE="登録">
</FORM>
</BODY>
</HTML>
No.1ベストアンサー
- 回答日時:
多分大阪を選んだら市町村のプルダウンに大阪分を、東京を選んだらその市町村をプルダウンに配置したいのだと思いますが、あってるのかな?
その場合はページをDOM管理して都道府県のプルダウンが選択されたら、AJAXで市町村分のデータを受け取り、DOMでプルダウンの項目を書き換えるのが自然だと思います。
ただし、AJAXやDOM管理には色々な知識が必要ですし、手間もかかります。もし、質問にある項目数の程度なら、全てページに埋め込みjavascriptで管理するほうが楽かもしれませんね。
なので、多分PHPの質問というよりAJAXやDOMに詳しい人に聞くほうが答えが早く見つかるのかも。
答えになってなく不安ですが・・・
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript 2段階プルダウンで1段階目の選択を終えた後に選択ボックスを見えなくしたい 2 2022/07/05 21:58
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- JavaScript プログラムがうまく動きませんレビューお願いします 1 2022/07/10 05:08
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
SafariのIframeで高さが取得で...
-
クリッカブルマップのリンク部...
-
javascriptの基本的なことだと...
-
Null またはオブジェクトではあ...
-
DOM要素を削除しても、イベント...
-
Javascriptで定期的にF5を押す...
-
IE操作で別タブ表示のHTMLソー...
-
乗換案内 VBAで操作したい
-
TEXTAREA内の改行位置をinnerHT...
-
チャットフォームで文字色をラ...
-
このjavascriptのif文、条件式...
-
背景ランダム
-
選択によってsubmitボタンの色...
-
LaTeX:数式を等号揃えにする方法
-
functionから別のfunctionを実...
-
javascriptで自動計算フォーム...
-
日本語入力の禁止
-
URLの一部をコピーできるブック...
-
関数でy=g(x)のgとは何の略です...
-
google apps scriptの終了のさせ方
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
JavaScript window.openで開く...
-
このjavascriptのif文、条件式...
-
FireFoxのjavascriptで自動でキ...
-
DOM要素を削除しても、イベント...
-
javascriptの基本的なことだと...
-
文字を一文字ずつ表示
-
showModalDialogで開いた画面を...
-
Null またはオブジェクトではあ...
-
Javascriptのhtml出力についてa...
-
codejump 模写コーディングgall...
-
LaTeX:数式を等号揃えにする方法
-
javascriptのdocument.allにつ...
-
excle VBA とweb上の検索を利用...
-
Latexに関する質問です。
-
乗換案内 VBAで操作したい
-
JavaScriptのdocument.all("変...
-
Javascriptで定期的にF5を押す...
-
選択によってsubmitボタンの色...
-
スマホでフォームにフォーカス...
-
compatModeとは?
おすすめ情報