質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.62%

  • PHP

    19756questions

    PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

  • JavaScript

    15865questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • MySQL

    5678questions

    MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

プルダウンデータを選択後、その関連項目を表示したい

解決済

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 1,384

chapp

score 156

お世話になってます。

入力フォームなどで、プルダウンを選択後、その選択されたデータに関連する項目をチェックボックスで表示したいと考えていますが、ここ数日調べているものの検索キーワードが不適切なためか、望んでいるサイトにたどり着くことが出来ません。

※return check()にてPOST?するのではなく、ページ遷移することなく、その場で表示を継ぐ次と変えて行きたい。

添付画像がその例ですが、市区郡を選択後、そこに属する市町村がチェックボックスを含め表示されるようにしたいと考えてます。

これらデータはMyQSLにて管理しており、テーブルは都道府県、市区郡、市町村等それぞれ別のテーブルで構成され、基本的なサイトの設計はselect分などのスクリプトも含め、PHPで作成しています。

話を戻しますが、これら一連の動作はjavascriptで作ることが出来るのでしょうか?これまでjavascriptとは縁があまりなく、学んだことが無いのが現状です。恐れ入りますが、ご教示頂けると助かります。

もちろん、これら例を説明したサイトでも構いません。アドバイスのほど宜しくお願い申し上げます。

イメージ説明
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

checkベストアンサー

0

これらデータはMyQSLにて管理しており、テーブルは都道府県、市区郡、市町村等それぞれ別のテーブルで構成され、基本的なサイトの設計はselect分などのスクリプトも含め、PHPで作成しています。 
話を戻しますが、これら一連の動作はjavascriptで作ることが出来るのでしょうか?

はい、可能です。

まず第一歩目としては、MySQLから取ってきたデータを

$data = json_encode($hogehage, JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_HEX_AMP);

こんな感じでPHPのjson_encodeで、JSON化し、HTMLのヘッダー部分に

<script>
var data = JSON.parse('{$data}');
</script>

として、出力します。そうするとHTMLが準備される過程で$dataがJSON.parse()されてJavaScriptのオブジェクト data に変換されるので、

select のonChangeイベントを契機としてdataオブジェクトを検査し、該当する市区郡内の市町村情報のみを表示する

という流れになります。

一つづつやっていけば意外と簡単です。
まず、フロント側のみに集中して、HTMLのヘッダーにJSONを手動でべた書きして動作するプログラムをつくるところから始めてはいかがでしょうか?

(本当はselectのonchangeイベントの度にAjaxで情報を取りに行きたいところです。)

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/03/15 19:24

    luckerさん

    はじめまして。ご親切なアドバイスをありがとうございます。

    一連の流れに加え、説明を不わえて頂き有難うございます。

    お恥ずかしながら難関なので、改め調べてみます。
    また不明な際は質問させて下さい。

    ありがとうございました。

    キャンセル

0

ここ数日調べているものの検索キーワードが不適切なためか
"プルダウン 連動"で調べれば出てくると思いますよ。

あと、下記の2点について教えてください。

[質問1]
「青戸~四つ木」のような名前は、他の区も全部含めて何個くらいあるのでしょうか?


[質問2]
jQueryは使用可能でしょうか?

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/03/15 19:19

    bigfatratさん

    はじめまして。ご親切なアドバイスをありがとうございます。

    まず質問の回答ですが、この部分は市区町村になるので、検討の余地はあると思いますが、全国を対象とした場合、118,000件ほどになるかと思います。

    それとjQueryですが、サンプルソースを眺める程度でコードを書けるようなレベルではありません。

    プルダウン連動ですね・・・今から改め調べてみます。
    有難うございます!

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.62%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • PHP

    19756questions

    PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

  • JavaScript

    15865questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • MySQL

    5678questions

    MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。