JavaScript + Thymeleaf-选择onchange

问题描述

我在百里香上下文中有一个对象services的列表，并且我的页面中有以下内容:

I have a list of objects services in my thymeleaf context, and I have the following at my page:

<select id="inputService" name="idService" size="1">
    <option th:each="service : ${services}" th:text="${service.name}" th:value="${service.idService}"/>
</select>
<p id="selectedServiceLimits"></p>

services中的每个对象都包含字段minAmount和maxAmount.如何通过javascript将select中选定的service的这两个字段打印到我的p元素中?在准备好文档后，如何打印选择的这两个字段?

Each object from services contains fields minAmount and maxAmount. How can I print into my p element the these two fields of the selected service in select by javascript? And how can I print these two fields of the option that is selected when document is ready?

谢谢！

推荐答案

<script th:inline="javascript">
            /*<![CDATA[*/
            function showLimits() {
                var services = /*[[${services}]]*/ null;
                var selectedIndex = $("#inputService option:selected").index();
                var service = services[selectedIndex];
                $("#amountLimits").text("Мин. сумма: " + service.amountMin + ", макс. сумма: " + service.amountMax);
            }
            $(function() { showLimits(); });
            /*]]>*/
</script>

<select id="inputService" name="idService" size="1" onChange="showLimits()">

这就是解决方案

这篇关于JavaScript + Thymeleaf-选择onchange的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！