问题引入
使用LayUi做表单时,发现radio的数据无法回显。同时这也导致提交修改后,radio传递的值为空。
解决
代码
<div class="layui-form-item">
<label class="layui-form-label">性别</label>
<div class="layui-input-block">
<input type="radio" lay-verify="sex" name="sex" value="1" title="男" >
<input type="radio" lay-verify="sex" name="sex" value="0" title="女">
</div>
</div>
手动渲染radio的值,需要再查一次用户信息
//查询用户进行回显
var userId = $("#userId").val();
$.ajax({
type: "post",
url: "/user/getUserSex",
data: {
"userId": userId
},
async: true,
dataType: "json",
success: function (result) {
//console.log(result.data.sex)
//回显用户性别
$("input[name=sex][value=0]").attr("checked", result.data.sex == 0 ? true : false);
$("input[name=sex][value=1]").attr("checked", result.data.sex == 1 ? true : false);
layui.form.render('radio'); //更新全部radio
}
});
Q.E.D.