Layui处理表单复选框数据

2023-10-20 13:34:34

问题

表单中复选框拥有相同的name属性，怎样将复选框选项封装为数组提交？

<div class="layui-input-block">
    <input type="checkbox" name="roles" value="0" title="游客">
    <input type="checkbox" name="roles" value="1" title="普通用户" checked>
    <input type="checkbox" name="roles" value="2" title="管理员" checked>
</div>

解决方法

思路：在表单提交时用JS动态处理

form.on('submit(btn)', function(data) {
    let roles = [];
    data.form.querySelectorAll("input[name='roles']:checked").forEach(ele = >roles.push(ele.value));
    data.field['roles'] = roles; // ['1', '2']
    return false;
}

参考

触发submit提交