LAYUI单选,复选选中状态在重新编辑时,回显不到选中状态的处理,通过定义三个状态的按钮ID,在JS中用回显示的DATA值去做下判断然后重新给这个按钮PROP一下选中状态。
JS
table.on('tool(get_broker_customer_data)', function (obj) {
var data = obj.data;
if (obj.event === 'edit') {
layer.open({
title: "UPDATE BORROWER",
content: $('#borrower_form'),
closeBtn: 1,
type: 1,
anim: 5,
shade: 0.5,
area: 'auto',
maxWidth: '500px',
success: function () {
console.log(data.borrower_status);
if (data.borrower_status == '1') {
console.log('a');
$(status1).prop("checked", true);
} else if (data.borrower_status == '2') {
console.log('b');
$(status2).prop("checked", true);
} else if (data.borrower_status == '3') {
console.log('c');
$(status3).prop("checked", true);
}
// 数据回显
form.val("layui-edit-form", {
"borrower_id": data.borrower_id,
"borrower_truename": data.borrower_truename,
"borrower_phone": data.borrower_phone,
"borrower_email": data.borrower_email,
"borrower_purpose": data.borrower_purpose,
"brorrwer_status": data.borrower_status,
})
}
})
}
});
HTML
<div class="model-form" id="borrower_form" style="display:none">
<form class="layui-form layui-form-pane" id="borrower_form_arry" lay-filter="layui-edit-form" method="post"
autocomplete="off" novalidate>
<div class="layui-form-item layui-form-text" style="display: none;">
<label class="layui-form-label">ID</label>
<div class="layui-input-block">
<input type="text" readonly style="background: #efefef;" maxlength="50"
class="layui-input form-reference" name="borrower_id">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">Name</label>
<div class="layui-input-block">
<input type="text" readonly style="background: #efefef;" maxlength="50"
class="layui-input form-reference" name="borrower_truename" placeholder="Borrower Name"
lay-verify="required" lay-reqtext="Please Input Borrower UserName">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">Phone</label>
<div class="layui-input-block">
<input type="text" readonly style="background: #efefef;" maxlength="50"
class="layui-input form-reference" name="borrower_phone" placeholder="Borrower Phone"
lay-verify="required" lay-reqtext="Please Input Borrower Phone">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">Email</label>
<div class="layui-input-block">
<input type="text" readonly style="background: #efefef;" maxlength="50"
class="layui-input form-reference" name="borrower_email" placeholder="Borrower Email"
lay-verify="required|email" lay-reqtext="Please Input Borrower Email">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">Purpose</label>
<div class="layui-input-block">
<input type="text" readonly style="background: #efefef;" maxlength="100"
class="layui-input form-reference" name="borrower_purpose" placeholder="Borrower Purpose"
lay-verify="required" lay-reqtext="Please Input Borrower Purpose">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">Status</label>
<div class="layui-input-block" style="border: 1px solid #206bc4;">
<input type="radio" id="status1" name="borrower_status" value="1" title="Lodged">
<input type="radio" id="status2" name="borrower_status" value="2" title="Settled">
<input type="radio" id="status3" name="borrower_status" value="3" title="Aborted">
</div>
</div>
<div class="layui-form-item layui-form-text">
<div class="layui-input-block">
<button class="layui-btn layui-btn-normal layui-btn-radius" lay-submit
lay-filter="borrower_update"><i class="layui-icon layui-icon-ok"></i> Update </button>
<button class="layui-btn layui-btn-primary layui-btn-radius" type="reset"><i
class="layui-icon layui-icon-close"></i> Reset </button>
</div>
</div>
</form>
</div>