使用JSTL动态更改文本字段值

I'm a beginner at JSTL as I've only started using it recently to avoid using scriplets in my JSP, and I wanted to ask for help about something I've been stuck in.

我是JSTL的初学者,因为我最近才开始使用它来避免在我的JSP中使用scriplet,我想要求我帮忙解决一些问题。

I have a select element which I've managed to populate with an arraylist using JSTL. However I also need to dynamically change the value of a readonly text field whenever a different option in the dropdown list is selected, and the value to put in the text field is at the same index in the arraylist as the selected option, and that's where I'm having trouble with.

我有一个select元素,我已经设法用一个使用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>

I tried to use a js function to change the text field's value but so far, I've had no luck with getting it to work.

我尝试使用js函数来更改文本字段的值,但到目前为止,我没有运气让它工作。

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

It would have been easier if both department and manager fields were both dropdown lists, but we were required to make manager a text field so I'm kind of at a loss trying to work around it.

如果部门和经理字段都是下拉列表,那会更容易,但我们需要让经理成为一个文本字段,所以我有点不知所措,试图解决它。

1 个解决方案

#1

You can't use jstl language on rendered pages. jstl is server side only and can't be used on end-user browser.

您不能在呈现的页面上使用jstl语言。 jstl仅限服务器端,不能在最终用户浏览器上使用。

You need to use js to change it.

您需要使用js来更改它。

The function you have wrote is good expect the jstl syntax that cannot be no more interpreted.

你写的函数很好地期望jstl语法不能再被解释。

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

Something like this should work.

这样的事情应该有效。

But I think that the text you want to print is server side, so you can print it in some html/tag or hidden select and take the result from it. replacing the select.options[x].text:

但我认为您要打印的文本是服务器端,因此您可以在某些html / tag或隐藏选择中打印它并从中获取结果。替换select.options [x] .text:

<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;
}

#1