Layui处理表单复选框数据

本文主要是介绍Layui处理表单复选框数据，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

问题

表单中复选框拥有相同的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提交

这篇关于Layui处理表单复选框数据的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！