layui select必填
时间: 2023-09-01 22:11:45 浏览: 172
如果你使用 layui 的 select 组件,并且需要对某些选项进行必填校验,可以在提交表单前,通过遍历选项的值来判断是否有必填项未填写。具体实现如下:
1. 在 select 组件中添加必填项的标识,例如在选项中添加一个 `required` 属性:
```html
<select name="gender" lay-verify="required">
<option value="">请选择性别</option>
<option value="男">男</option>
<option value="女">女</option>
</select>
```
2. 在提交表单的时候,通过遍历选项的值来判断是否有必填项未填写:
```javascript
layui.use(['form', 'layer'], function(){
var form = layui.form;
var layer = layui.layer;
// 监听表单提交事件
form.on('submit(formDemo)', function(data){
// 遍历 select 组件的所有选项
var flag = true; // 是否通过校验
$("select[lay-verify='required']").each(function(){
if($(this).val() == ''){ // 如果选项未选择
flag = false;
layer.msg($(this).attr('lay-verify') + "不能为空");
return false; // 跳出循环
}
});
if(flag){ // 如果通过校验
// 提交表单
$.ajax({
url: '/submit',
type: 'post',
data: data.field,
success: function(res){
layer.msg('提交成功');
},
error: function(){
layer.msg('提交失败');
}
});
}
return false; // 阻止表单的默认提交行为
});
});
```
这样,当有必填项未填写时,会提示对应的错误信息,并且不会提交表单。
阅读全文