🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
JSP

JSP(Java Server Pages)とは、ウェブアプリケーションの表示レイヤーに使われるサーバーサイドの技術のことです。

mysqli

MySQLiはPHP5より導入されているデータベース用のドライバです。MySQL 4.1.3以降の新しい機能の利点をまとめています。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

JavaScript

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

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

1回答

34084閲覧

jsp・js間のデータ受け渡し方法

HunterG

総合スコア11

JSP

JSP(Java Server Pages)とは、ウェブアプリケーションの表示レイヤーに使われるサーバーサイドの技術のことです。

mysqli

MySQLiはPHP5より導入されているデータベース用のドライバです。MySQL 4.1.3以降の新しい機能の利点をまとめています。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

JavaScript

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

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

2クリップ

投稿2016/11/16 04:38

###前提・実現したいこと
java、springにてDB(mysql)を検索した結果を表示する
プログラムを作成しようとしています。

その際に、検索条件をプルダウンで選択できるようにしようとしており、
そのプルダウンの内容をDBから取得した値を表示させたい。

###発生している問題・エラーメッセージ

DBから取得した内容をどのようにすればJavaScriptに渡せばよいかわからない。

###該当のソースコード

java(Controller) public String xxx(Model model) { List<Map<String, Object>> list = jdbcTemplate.queryForList( "select CODE,CODE_NAME from yyy); model.addAttribute("list", list); return "zzz"; }
DBデータ テーブル:yyy CODE | CODE_NAME 1 | test1 2 | test2 3 | test3
jsp <body onLoad="function1()"> <form name="Conditions" onChange="function1()"> 条件1 <select name="Condition1"> <option value="1" selected>aaa</option> <option value="2">bbb</option> <option value="3">ccc</option> </select> <select name="Condition2"> </select> </form> </body>
js function function1() { var select1 = document.forms.Conditions.Condition1; var select2 = document.forms.Conditions.Condition2; select2.options.length = 0; if (select1.options[select1.selectedIndex].value == "1") { //ここにDBから取得した値を表示するようにしたい //select2.options[0] = new Option("test1"); //select2.options[0] = new Option("test2"); //select2.options[0] = new Option("test3"); } else if (select1.options[select1.selectedIndex].value == "2") { select2.options[0] = new Option("abc"); select2.options[1] = new Option("def"); } else if (select1.options[select1.selectedIndex].value == "3") { select2.options[0] = new Option("ghi"); select2.options[1] = new Option("jkl"); }

###実施事項
下記コードでDBからデータを取得できていることは確認できましたが、
listをどのようにjsに受け渡し、表示させるのかがわかっていません。

jsp <select name="conditions"> <c:forEach var="tmp" items="${list}"> <option value="${tmp.CODE}"><c:out value="${tmp.CODE_NAME}" /></option> </c:forEach> </select>

###補足情報(言語/FW/ツール等のバージョンなど)
言語:java,javaScript,jsp
フレームワーク:Spring

気になる質問をクリップする

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

Select1の変更イベントでSelect2の中身を書き換えたいというのであれば、
Select1のチェンジイベントで、

A) サブミットしてselect2の結果をとってくる。
フォームはオンロードで書き換える。(たぶん、これではない)
B) ajaxでpostし、要求すると、検索結果がコールバック関数に返ってくる。
そのコールバック関数の中で、結果を用いて書き換える

の、B)が望む要求仕様を満たす動作だと思われます。

投稿2016/11/16 06:05

akio221

総合スコア716

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

HunterG

2016/11/16 07:50

説明力&理解力が足りなくて申し訳ありません。 やりたいこととしては、Controllerで取得したlistをjsに渡し、 その内容をforeach等ですべて表示しようとしているので、 listをjsに渡す方法が知りたいです。 ※見当違いの事を言っていたら申し訳ありません。
akio221

2016/11/16 08:11

私の回答はajaxで呼び出して、コントローラからJSONで返し、 そのままjavascript内で利用してはいかが、という意味でしたが、 コントローラで受け取ったlistをスクリプト化したい、ということですか? たとえば、JSPに、scriptタグで、 ``` <script type="text/javascript"> function selectReload(selected) { $('#select1 > option').remove(); switch (selected) case 1: <c:forEach var="tmp" items="${list1}"> $('#select1').append($('<option>').html('<c:out value="${tmp.CODE_NAME}" />').val('<c:out value="${tmp.CODE}" />')); </c:forEach> break; case 2: //以下略 <c:forEach var="tmp" items="${list2}"></c:forEach> break; } </script> ``` と言ったものを書くような?(お勧めはできませんが・・)
HunterG

2016/11/18 09:13

失礼いたしました。 自分が考えていた方法では、マッピングリストの状態でデータを取得できませんでした。 ご指摘いただいた通り、ajaxを使用した結果データを取得することができました。ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問