JSTLを使用して動的にテキストフィールドの値を変更する

Question

私はJSPでスクリプレットを使用しないように最近使用し始めたばかりなので、JSTL初心者です。

私はJSTLを使用してarraylistを設定することができた選択要素があります。しかし、私はまた、ドロップダウンリストの別のオプションが選択され、テキストフィールドに入れる値がarraylistの同じインデックスに選択されたオプションとしてあるときは常に、読み取り専用のテキストフィールドの値を動的に変更する必要があります。私は問題を抱えています。

<select id="department" onchange="managerfill()"> 
<c:forEach var="dept" items="${departments}"> 
<option value="${dept.deptname}"><c:out value="${dept.deptname}"/></option> 
</c:forEach> 
</select> 

<input type="text" id="manager" readonly> 

私は、テキストフィールドの値を変更するには、JS関数を使用しようとしましたが、これまでのところ、私はそれが動作するようになって運がなかったしました。

function managerfill() { 
var x = document.getElementById("department").selectedIndex; 
document.getElementById("manager").value="${departments[x].manager}"; 
} 

部門とマネージャー両方のフィールドならば、それが簡単だっただろうので、私はそれを回避しようとして途方に暮れて一種のよ両方のドロップダウンリストだったが、我々はマネージャのテキストフィールドを作成する必要がありました。

Answer 1

レンダリングされたページではjstl言語を使用できません。 jstlはサーバー側のみであり、エンドユーザーのブラウザでは使用できません。

jsを使用して変更する必要があります。

あなたが書いた関数は、それ以上解釈できないjstl構文を期待しています。

function managerfill() { 
    var select = document.getElementById("department"); 
    var x = select.selectedIndex; 
    document.getElementById("manager").value = select.options[x].text; 
} 

このようなものは動作するはずです。

しかし、印刷したいテキストがサーバー側であると思うので、html /タグや非表示のselectで印刷して結果を得ることができます。そのため

<select id="departments-manager" class="hidden"> 
    <c:forEach var="dept" items="${departments}"> 
    <option value="${dept.manager}"><c:out value="${dept.manager}"/></option> 
    </c:forEach> 
</select> 


function managerfill() { 
    var select = document.getElementById("department"); 
    var selectManager = document.getElementById("departments-manager"); 
    var x = select.selectedIndex; 
    document.getElementById("manager").value = selectManager.options[x].text; 
}