• ベストアンサー

コンボボックス選択時に関連する情報をテキストボックスに表示させたい。

現在、以下のようなものをJavaScriptで実現しようとしているのですが、方法がわからないので質問させていただきます。 DBに商品テーブルがあって、カラムが「商品コード」「商品名称」「金額」だとします。 画面にはコンボボックスと右横にテキストボックスがあって、 コンボボックスには商品名称のみ表示、金額はテキストボックスに表示します。 (商品コードは<option>のvalueに設定します) サーバにアクセスせずにコンボボックスの内容を選択するたびに、対応する金額が表示されるようにしたいです。 PHPでコンボボックスを作成するときにvalueに商品コードと金額を区切り記号("_"など)で連結した値を設定しておき、 それを商品コードと金額に分解すれば実現できると思うのですが、もう少しスマートな方法があればと思い、質問させて頂きました。 環境はWindowsXP、PHP5、MYSQLです。 よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

>PHPでコンボボックスを作成するときにvalueに商品コードと金額を区切り記号 >("_"など)で連結した値を設定しておき、 単純にvalueに商品コードをいれておき、金額用のリストを用意しておけばよいのでは? <script> var kingaku={x001:300,y002:200,z003:100}; function setKingaku(obj){ var f=obj.form; if(obj.value==""){f.kingaku.value="";return false;} f.kingaku.value=kingaku[obj.value]; } </script> <form> <select onchange="setKingaku(this)"> <option value="">選択</option> <option value="x001">りんご</option> <option value="y002">みかん</option> <option value="z003">ばなな</option> </select> <input type="text" name="kingaku" value=""> </form>

danmakuusu
質問者

お礼

ありがとうございます。 無事、実現できました。

その他の回答 (3)

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.4

valueに入れると送信時か受取ったサーバ側でコードと金額に分離しないといけないので、titleを使うといいのかな。 <option value="商品コード" title="金額">商品名称</option> これで、選択中にマウスを静止させるとブラウザの機能でtitleの内容をバルーン表示してくれるのでユーザーにも少しだけ優しくなる・・かな。 具体的な状況がわからないのでこれでいいのかもしれないけど、 選択を決定するまで金額が見えないのは不便なんで 普通に商品名称と一緒に表示するべきだとも思うけど。。 なお、金額をテキストボックスに表示、と、ありますが、テキストボックスの金額をサーバ側で受取って処理をするならセキュリティ上問題ありです。 金額はコードによりDBから再び引っ張ってくるべきです。 なんか余計なコトの方が多い回答で失礼。

danmakuusu
質問者

お礼

いろいろとありがとうございます。 今後に役立ちそうです。

  • pick52
  • ベストアンサー率35% (166/466)
回答No.3

しまった、サンプル作ってたら一足遅くてかぶった。(^_^; 発想は下の方とほとんど同じようですね。

  • pick52
  • ベストアンサー率35% (166/466)
回答No.2

イメージとしてはこんな感じですか。 <html lang="ja"> <head> <script> // 連想配列に情報を格納しておく var goods = { '' : '', '1' : '商品1 xxxx', '2' : '商品2 xxxx' }; // リストボックスが変更されたら value 値を // 元にして連想配列から情報を取得する function change() { var form = document.f; form.t.value = goods[form.sel.value]; return; } </script> </head> <body> <form name="f"> <select name="sel" onchange="change();"> <option value="">商品</option> <option value="1">商品1</option> <option value="2">商品2</option> </select> <input type="text" name="t" value=""> </form> </body> </html>

danmakuusu
質問者

お礼

ありがとうございます。 無事、実現できました。

関連するQ&A

  • コンボBOXで抽出した値をテキストBOXに表示したい

    入力用フォームで注文フォームを作成しているのですが、コンボBOXで商品Noを抽出し、テキストBOXに商品名を表示したいのですが、 Private Sub コンボ1_AfterUpdate() Me!テキスト1 = Me!コンボ1.column(1) End Sub と入力したのですが、他の行にも同じ商品名が表示されます。 商品NoをコンボBOXで指定し、数量を手入力という入力フォームを作成したいのです。 作成方法を教えてください。 よろしくおねがいします

  • テキストボックスからコンボボックスへ自動入力したい

    AccessVBA初心者です。 Access2003を使用しています。 formAフォーム上の非連結textBテキストボックスに英字を入力 して、exe実行ボタンをクリックしたら、Cテーブルに連結した cmbCコンボボックスに該当文字列を表示したいです。 Private Sub exe_Click() If Me.textB.Value = "A" Then Me.cmbC.Value = 1 Else Me.cmbC.Value = 2 End If End Sub 実行ボタンをクリックしても、コンボボックスの内容は変わり ません。 if文にブレークポイントを設定してステップインで一行ずつ実 行するとコンボボックスに数字にあった文字列が表示できます。 うまく表示できるように、よろしくお願い致します。

  • ACCESS コンボボックス 抽出 テキストボックスに表示

    初めての質問を投稿させていただきます。l ACCESSのVBAにて分からないことがあるので、 質問を投稿させていただきました。 以下のようなテーブルがあります。 名称:番号:管理番号:価格 cake|NO.1|C1|200 cake|NO.2|C2|200 chocolate|NO.1|C3|300 chocolate|NO.2|C4|300 chocolate|NO.3|C5|300 cookie|(空白)|C6|100 フォーム上に、コンボボックスが二つ設置されており 最初のコンボボックスでは、cake、chocolate、cookieを選択することができます。 また、二つ目のコンボボックスでは最初のコンボボックスで選択した名称に対する番号を選ぶことが出来ます。 ------------------以下が疑問点です------------------------- このフォームにはそれ以外にテキストボックスが設定されています。 名称と番号を設定した後に管理番号(重複なし)をテキストボックスに表示。 その後、管理番号を元に価格もテキストボックスに表示したいと考えておりますが、どのようなプログラムを組めばよろしいでしょうか?

  • Access テキストボックスとコンボボックス

    Access初心者で、勉強がてらデータ登録フォームを作成しています。 フォーム上にコンボボックスを設置し、 テーブルに保存されているデータを検索できるようにしたのち、 テキストボックスのコントロールソースには簡単に 「=[コンボボックス].[column](2)」としています。(それぞれの名前は仮称です) 後から、テキストボックスひとつで 「コンボボックスからの検索結果を表示させる」と 「テキスト入力も可能とする」 を共存させたいと思い始めたのですが、可能になりますでしょうか。 ただし「コンボボックスからの検索結果表示」をしたテキストボックスに対し、 その情報をフォーム上で書き換えたとしても、テーブル側のデータ書き換えは行いたくありません。 よろしくお願いいたします。

  • テキストボックスとコンボボックス

    こんにちは、Accessのフォームにテキストボックスとコンボボックスを設置して、以下のような事ができないかと悩んでおります。 フォーム内には、テキストボックスとコンボボックスが設置してありまして、コンボボックス内にDB(会社名テーブル)から取得した全ての会社名が入っています。 しかし、そのレコード数が300件近くあるため、コンボボックス内から探し出すのに手間が掛かります。 そこで、コンボボックスの隣にテキストボックスを設置し、テキストボックス更新後に会社名テーブルの検索を行い、条件に合った会社名だけをコンボボックス内に入れることを考えているのですが、上手く行きません。 動作のイメージとしては下記のようになります。 (1)初期表示時はテキストボックス内に何も入力されていないので、全レコードがコンボボックス内に表示される。 (2)テキストボックスに「有限」と入力して、テキストボックスからフォーカスを移動させると、コンボボックス内に「有限」が会社名に含まれているレコードのみが入っている。 (3)テキストボックスを空白に戻すと、コンボボックス内には全レコードが表示 以上、どなたかご教授よろしくお願いします。

  • コンボボックスの表示について

    コンボボックスで選択した「駅名」に関連する「沿線番号」と「駅番号」をテーブルに書き込みたいのですが、「駅名」の表示に問題がありますのでご指導ください。 XP、Access 2007 T_テーブル 駅名  (テキスト) 沿線番号 (数値) 駅番号  (数値) T_駅コード 駅名     沿線番号   駅番号 成増          0     0 地下鉄成増     1     0 下赤塚         0     1 地下鉄赤塚     1     1 列数 3 (これが怪しい?) 連結列 3 リスト行数 4 値集合ソース T_駅コード Private Sub cbo_駅名_AfterUpdate() Me!沿線番号 = Me!cbo_駅名.Column(1) Me!駅番号 = Me!cbo_駅名.Column(2) End Sub この場合、「沿線番号」と「駅番号」はテーブルに書き込みできるのですが、コンボボックスで選択した駅名の表示がおかしく、テーブルに書き込みされません。どの設定に間違いがあるのでしょうか、お教え下さい。

  • コンボボックスからテキストボックスに連続して値を出したい

    エクセルVBAのユーザーフォームで、コンボボックスで選択したものをコマンドボタンを押すことで、同じフォーム上のテキストボックスに表示するところまではできたのですが、同じテキストボックスに追記する形でコンボボックスで選択したものを表示したいのですが、可能でしょうか。テキストボックスは複数行表示できるようにプロパティのMultiLineはTlueに設定することはしたのですが、2回目以降コンボボックスで選択した後コマンドボタンを押してもそのまま上書きするようなコードしかわかりません。 テキストボックスに、20回目まで選択項目を追加表示し、最後にはエクセルのシートにそのデータをコピーしたいのです。果たして、そのようなことは可能でしょうか。可能であればどのように記述すればよいのでしょうか。ぜひ諸先輩方のお知恵をお貸しください。よろしくお願いします。

  • ACCESSのコンボボックスについて

    ACCESSのコンボボックスに「012/015/028/125」等が設定されているて、 コンボボックスのプロパティの「入力チェック」は「はい」の設定になっております。 そういった場合、「12」と入力した場合、「012」とすることは可能でしょうか? テキストボックスの場合には、そのテキストボックスの更新後処理で Me.コード = Format(Me.コード, "000") のように記述し変更していたのですが・・・。 コンボボックスでは、「指定した値はリストにありません」と表示され、更新後処理がが実行されません。

  • コンボボックスにつきまして

    JComboBoxを使って、コンボボックスを作成したいのすが、 表示は名称で、実際の値取得はコードで取りたいのですが、 可能でしょうか? 例えば、 コード  名称 001   りんご 002   ぶどう 003   パイン というデータをセットし、 コンボボックスのドロップダウンでは「りんご」を選択したときには、 「001」という値を取得したいのです。 よろしくお願いします。

    • ベストアンサー
    • Java
  • VBでコンボボックスとテキストボックスの連係

    VBでフォームにデータコンボボックスとテキストボックスを一つづつ作り、データコンボボックスで値を選択し、その値に対する値をテキストボックスに表示させたいんですがどうすればいいでしょうか? データコンボボックスで選択する元になるテーブルは ID | 商品 1 | みかん 2 | ばなな 3 | りんご と、上記のような形のテーブルをもちいています。 例えばデータコンボボックスで「1」を選択した場合テキストボックスに「みかん」と表示させたいです。

専門家に質問してみよう