http://5am.jp/javascript/form_change_javascript/
上記のサイトにあるサンプルソース(セレクトボックス)のようなものを実装しているのですが
ここのセレクトボックスで項目を変えると遷移先の内容を切り替わるようにしたいのですが可能でしょうか？
具体的にはセレクトボックスで選ばれたものによって遷移先のtableの中身が切り替わります。
切り替わる種類は３パターンのみです。
いずれも別々のcsvファイルになっています。（１つにまとめたほうがいい場合はそれでも構いません）
tableの中はcsvからテキストをPHPで取って来ています。
表の上には表のタイトルがありそれも切り替わるようにしたいです。（<h2>の中）
遷移先のページは同じURLですが、後ろにパラメータなど何か判別するものをつけるのは構いません。
上記のURLのサンプルソース(セレクトボックス)の例だと
「初めてを申し込む」選択時、紹介者に名前を入れて送信ボタン（サンプルにはないですが）を押した場合
Aのテーブルの中身を表示。
「2度目以降の利用」も同様。
ただ、紹介者に名前が入っていない場合は３パターン全てを表示。
もともと３つ用意しておいて、表示、非表示の方が簡単でしょうか？
いろいろわかりにくくて申し訳ございません。
よろしくおねがいします。
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
+2
考え方が２つ
セレクトボックスで項目を選んだあとなんらかのサブミットをおこなうのであれば
ただのformの送信です。セレクトボックスに付けられたnameに従って
遷移先のデータは変化するでしょう。とうぜんそれは遷移先がやることです。そうではなくセレクトボックスを選んだ瞬間にページが遷移する場合。
たとえばlocation.hrefなどで移動するのであれば、今選んだセレクトボックスの
nameと値を付加して与えれば、飛び先でそれに応じたデータが表示されます。
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
checkベストアンサー
+1
こんな感じです。セレクトボックスのあるほうのフォームから、PHPへパラメータを送り、$_REQUEST変数を使ってそのフォームのデータを読み込みます。
セレクトボックス表示側
<form action="/view.php" method="GET">
<select name="csv_name">
<option value="aaa">
<option value="bbb">
<option value="ccc">
</select>
</form>CSV表示側(view.phpとする)
echo "<h2>" . $_REQUEST['csv_name'] . "</h2>"; // $_REQUEST['【formから送られてきたデータ名】']でformから送られたデータが取れる
$filepath = $_REQUEST['csv_name'] . ".csv"; // ここはあなたの環境にあわせて読み込みたいcsv名になるようにする
$fp = fopen($filepath, 'r');
while (($data = fgetcsv($fp)) !== FALSE) {
// $dataにはcsvの1行のデータが配列として入っている
}
fclose($fp);投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう！
- ただいまの回答率 88.23%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる
質問への追記・修正、ベストアンサー選択の依頼
masaya_ohashi
2017/11/07 13:49
少し質問文が伝わりにくいです。タグにPHP等のサーバサイド言語がありませんが、HTML上だけで完結したいということでしょうか？また、遷移先の内容を変えるというのも、どのレベルで変えるのでしょうか？ページ内の1行レベルなのか、そもそも全く違うページなのか…それも質問から伝わってきません。できれば現状のコード、及び「どういう表示になることを望んでいるか」を具体的に提示したほうが回答が得られる(というより現状だと回答は得られない)と思います。
2017/11/07 13:55
複数のユーザーから「やってほしいことだけを記載した丸投げの質問」という意見がありました
「質問を編集する」ボタンから編集を行い、調査したこと・試したことを記入していただくと、回答が得られやすくなります。
MeB
2017/11/07 15:42
失礼しました。どう説明たらもいいかわからず投げていました。修正いたしました。
masaya_ohashi
2017/11/07 15:45
ページの出力自体はPHPで行っているという認識でよいのでしょうか？そのPHPの現状のコードを貼られたほうが回答は得られやすいかと思います。可能であれば「セレクトボックス」がある方のPHP、及び「遷移先のページ」のPHPどちらも提示してください。
MeB
2017/11/07 15:57
セレクトボックスにある方にはまだPHPの記述はありません。jsでセレクトボックスの中身によってチェックする項目の数が変わったりするくらいです。遷移先はPHPでcsv読み込んでechoで対応する所に表示しているだけです・・・
masaya_ohashi
2017/11/07 15:59
「遷移先のページは同じURL」とは、セレクトボックスのあるURLと遷移先が同じ、という意味なのか、3パターンの遷移先は全部同じURL、という意味でしょうか？
MeB
2017/11/07 16:02
どちらもです。セレクトボックスのあるページとその遷移先のページ、この２ページで完結させたいと思っております。