表单元素的thymleaf回显

radio回显:

<div class="layui-form-item">
    <label class="layui-form-label">性别</label>
    <div class="layui-input-block">
        <input type="radio" name="uSex" value="男" title="男" th:field="*{user.uSex}">
        <input type="radio" name="uSex" value="女" title="女" th:field="*{user.uSex}">
        <input type="radio" name="uSex" value="未知" title="保密" th:field="*{user.uSex}">
    </div>
</div>

checkbox回显: th:attr ="checked=${user.uStatus eq '1' ? true : false}"

<input type="checkbox" id="uStatus" name="uStatus"  value="1" lay-skin="switch" 
lay-text="激活|注销" th:attr ="checked=${user.uStatus eq '1' ? true : false}">

图片src/字符串判断和取反:图片 th:src="${spu.imgUrl}"

<div th:if="${not #strings.isEmpty(spu.imgUrl)}">
    <img class="layui-upload-img headImage" th:src="${spu.imgUrl}" id="spuPic" width="160px" height="160px"/>
</div>

普通input回显:th:value="${spu.spuName}"

textarea回显要用: th:text="${spu.spuInfo}"

<textarea id="spuInfo" name="spuInfo" th:text="${spu.spuInfo}" 
    required="required"  lay-verify="required" 
    placeholder="请输入产品简介或宣传语,为买家提供有价值参考" 
    oninput="wordLeg(this);" maxlength="200"style="width: 400px;" 
    onpropertychange="if(value.length>200) value=value.substr(0,200)"
 class="layui-textarea">
</textarea>

我用的是layui的表单,向<select>内追加<option>,然后默认选中后台对象对应value。
以下是ajax在后台拿到的下拉列表。默认选中回显项,绑定<select>渲染。

select回显用,用ajax,向<select>内追加<option>,然后默认选中,后台对象对应value项回显。

//关键:默认选中对象的值[[${spu.cgId}]],选中回显 $('#cgId').val([[${spu.cgId}]]);

<select id="cgId" name="cgId" required="required" lay-verify="required" lay-filter="category"></select>
        //动态添加下拉框 同时可以设置回显默认值
        $.get("/backend/category/items", function (res) {
            if (res.state == 0) {
                $.each(res.datas,function(index,item){
                    console.log(item.cgName,item.cgId);
                    //option 第一个参数是页面显示的值,第二个参数是传递到后台的value值
                    $('#cgId').append(new Option(item.cgName,item.cgId));//往下拉菜单里添加元素
                });
                //关键:默认选中对象的值,回显
                $('#cgId').val([[${spu.cgId}]]);
            } else {
                layer.msg(res.message);
            }
            form.render();
        });

补充,第二种thymleaf语法:

[[ ${demo} ]],表示th:text,会转义特殊字符

[( ${demo} )],表示th:utext,不会转义特殊字符

时间格式化回显:

//直接显示:Web Mar 04 00:00:00 CST 2020
th:value="${coupon.cpDeadline}"
//改成:
th:value="${#dates.format(coupon.cpDeadline, 'yyyy-MM-dd HH:mm:ss')}"
//输出:2020-03-14 00:00:00

//另外:可以在实体类属性加注解@JsonFormat
@JsonFormat(pattern="yyyy-MM-dd HH:mm:ss",timezone="GMT+8")
    private Date cpDeadline;

其他:thymeleaf:字符串Strings常见的使用方法:

https://blog.csdn.net/qq_33535433/article/details/78876693

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值