如何使用JSTL设置复选框属性为true及满足<c:when>条件时选中复选框
关于JSTL控制复选框选中状态的问题解答
嘿,我来帮你搞定这两个和JSTL、复选框相关的问题!
1. 如何使用JSTL将复选框的属性设置为true?
HTML里的复选框逻辑很简单:只要checked属性存在(不管它的取值是checked、true甚至空值),就会处于选中状态。用JSTL实现的核心思路就是通过条件标签动态控制这个属性是否生效,常见的实现方式有两种:
- 用
<c:if>标签单独控制checked属性的渲染 - 用EL表达式的三元运算符直接在属性值里做判断,一步到位
2. 当<c:when>条件为true时,如何让复选框处于选中状态?
你给出的代码思路是可行的,但可以优化一下——毕竟大部分属性都是重复的,没必要写两遍<aui:input>,减少冗余会更易维护。
你的原始代码思路(可行但冗余)
<c:set var="status" value="${expData.status}" /> <c:choose> <c:when test="${status == 'Business Unit Approal'}"> <aui:input cssClass="custom-control-input expense select-all" type="checkbox" data-amount="${expData.expenseAmount}" data-expenseid="${expData.expenseId}" id="expenseCheckbox" name="expenseCheckbox" label="" checked="checked" /> </c:when> <c:otherwise> <aui:input cssClass="custom-control-input expense select-all" type="checkbox" data-amount="${expData.expenseAmount}" data-expenseid="${expData.expenseId}" id="expenseCheckbox" name="expenseCheckbox" label="" /> </c:otherwise> </c:choose>
优化后的简洁写法
利用EL三元表达式直接在checked属性里判断,只需要写一次<aui:input>:
<c:set var="status" value="${expData.status}" /> <aui:input cssClass="custom-control-input expense select-all" type="checkbox" data-amount="${expData.expenseAmount}" data-expenseid="${expData.expenseId}" id="expenseCheckbox" name="expenseCheckbox" label="" checked="${status == 'Business Unit Approal' ? 'checked' : ''}" />
如果你的<aui:input>(Liferay的AUI标签)支持布尔值类型的checked属性,还能更简单:
<c:set var="status" value="${expData.status}" /> <aui:input cssClass="custom-control-input expense select-all" type="checkbox" data-amount="${expData.expenseAmount}" data-expenseid="${expData.expenseId}" id="expenseCheckbox" name="expenseCheckbox" label="" checked="${status == 'Business Unit Approal'}" />
原理说明
- 当
status等于'Business Unit Approal'时,checked属性会被设置为checked(或布尔值true),复选框自动选中; - 当条件不满足时,
checked属性值为空(或false),复选框保持未选中状态。
内容的提问来源于stack exchange,提问作者Tirth Timaniya
相关产品推荐
相关产品推荐

