データ取得の方法にMapを使っているが、DBから取得した場合も使えます。
HTMLに直接javaを埋め込んでいるのでjspファイルを使用してください。
セレクトボックスで選択した人とそれに紐づいたメールアドレスの取得を行います。
①セレクトボックス選択前
②セレクトボックス選択中
③セレクトボックス選択後
データの定義
<%@page import="java.util.HashMap"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.Set"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
Map<String, String> map = new HashMap<>();
map.put("おれ", "おれのメールアドレス");
map.put("同僚", "同僚のメールアドレス");
map.put("上司", "上司のメールアドレス");
map.put("後輩", "後輩のメールアドレス");
map.put("先輩", "先輩のメールアドレス");
map.put("松本", "松本のメールアドレス");
map.put("代表取締役", "代表取締役のメールアドレス");
%>まず、人の名前とデータをMapにして格納します。
jspは<%%>でHTMLにjavaを埋め込むことができます。
表示側
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function setMail() {
var value = document.getElementById("selectUser").value;
var getMail = document.getElementById("getMail");
var text = value;
getMail.value = text;
}
</script>
</head>
<body>
<select id="selectUser" onchange="setMail()">
<option value=""></option>
<%for(Map.Entry<String, String> entry : map.entrySet()) { %>
<option value="<%=entry.getValue() %>" ><%=entry.getKey() %></option>
<%} %>
</select>
<input type="text" id="getMail">
</body>
</html>真ん中あたりの<%%>で埋め込まれているのが肝です。
選択された人が「キー」となってメールアドレスを呼びます。
呼ばれたメールアドレスは、<script></script>の間で、処理されテキストボックスへ表示されます。
全体のコード
<%@page import="java.util.HashMap"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.Set"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
Map<String, String> map = new HashMap<>();
map.put("おれ", "おれのメールアドレス");
map.put("同僚", "同僚のメールアドレス");
map.put("上司", "上司のメールアドレス");
map.put("後輩", "後輩のメールアドレス");
map.put("先輩", "先輩のメールアドレス");
map.put("松本", "松本のメールアドレス");
map.put("代表取締役", "代表取締役のメールアドレス");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function setMail() {
var value = document.getElementById("selectUser").value;
var getMail = document.getElementById("getMail");
var text = value;
getMail.value = text;
}
</script>
</head>
<body>
<select id="selectUser" onchange="setMail()">
<option value=""></option>
<%for(Map.Entry<String, String> entry : map.entrySet()) { %>
<option value="<%=entry.getValue() %>" ><%=entry.getKey() %></option>
<%} %>
</select>
<input type="text" id="getMail">
</body>
</html>念のため全体コードも載せておきます。
参考になれば嬉しいです。