根據下拉列表值的變化從數據庫中自動填充文本框

Question

我的jsp頁面有一個包含所有userIds的選擇框。我有兩個用於用戶名和出生數據的文本框。我想從下拉列表中選擇用戶標識時自動填充文本框。

我有一個單獨的Servlet類和數據庫類用於查詢。

如何自動從下拉菜單中選擇userid時的文本框？我想這個文本框是不可編輯的。有人可以提供我的示例代碼。

Answer 1

這JS Fiddle展示如何實現它：

var $select = document.getElementById('slct'), 
 
    $un = document.getElementById('un'), 
 
    $dob = document.getElementById('dob'), 
 
    val, arr, username, dob; 
 

 
// usually this array is obtained from a server response 
 
arr = [ 
 
    \t usr1 = ['user1', 'dob1'], 
 
    \t usr2 = ['user2', 'dob2'], 
 
    \t usr3 = ['user3', 'dob3'], 
 
    \t usr4 = ['user4', 'dob4'] 
 
    ]; 
 

 
$select.addEventListener('change', function(){ 
 
\t val = this.value - 1; // because arrays start at 0. 
 
\t username = arr[val][0]; 
 
    dob = arr[val][1]; 
 
    $un.value = username; 
 
    $dob.value = dob; 
 
});

<select id="slct"> 
 
    <option></option> 
 
    <option value="1">id 1</option> 
 
    <option value="2">id 2</option> 
 
    <option value="3">id 3</option> 
 
    <option value="4">id 4</option> 
 
</select> 
 
<input type="text" id="un" disabled> 
 
<input type="text" id="dob" disabled>