jQuery MiniUI
标题:
tabs与form表单组合验证问题
[打印本页]
作者:
mylaoying
时间:
2017-2-23 12:01:07
标题:
tabs与form表单组合验证问题
你好，我一个页面里有4个tabs选项卡。当提交表单时，只有当前选项卡里的表单能验证，其它选项卡里的表单控件无法验证。请问如何解决？
附代码：
<html>
<head>
<link href="http://localhost:8010/Scripts/ui/themes/default/ui.css" rel="stylesheet">
<script src="http://localhost:8010/Scripts/jquery/jquery-2.1.1.min.js"></script>
<script src="http://localhost:8010/Scripts/ui/ui.js"></script>
</head>
<body>
<form id="form1">
<div style="margin: 6px 10px 0px 10px;">
<div id="tabs" class="mini-tabs" activeIndex="0" style="width:100%;">
<div title="基本信息" id="home">
<table id="t1" class="form" cellpadding="0" cellspacing="0" border="0" style="margin: 5px 0px 5px 0px;">
<col width="80px" />
<col width="50%" />
<col width="80px" />
<col width="50%" />
<tr>
<th class="formTitle">名称</th>
<td class="formValue">
<input style="width: 100%;" name="FullName" class="mini-textbox" required="true" />
</td>
<th class="formTitle">编号</th>
<td class="formValue">
<input style="width: 100%;" name="F_RealName" class="mini-textbox" placeholder="请输入名称" />
</td>
</tr>
</table>
</div>
<div title="扩展信息" id="profile">
<table id="t2" class="form" cellpadding="0" cellspacing="0" border="0" style="margin: 5px 0px 5px 0px;">
<col width="80px" />
<col width="50%" />
<col width="80px" />
<col width="50%" />
<tr>
<th class="formTitle">名称</th>
<td class="formValue">
<input style="width: 100%;" name="FullName1" class="mini-textbox" required="true" />
</td>
<th class="formTitle">编号</th>
<td class="formValue">
<input style="width: 100%;" name="F_RealName1" class="mini-textbox" placeholder="请输入名称" />
</td>
</tr>
</table>
</div>
<div title="备注信息" id="messages">
<table id="t3" class="form" cellpadding="0" cellspacing="0" border="0" style="margin: 5px 0px 5px 0px;">
<col width="80px" />
<col width="50%" />
<col width="80px" />
<col width="50%" />
<tr>
<th class="formTitle">名称</th>
<td class="formValue">
<input style="width: 100%;" name="FullName3" class="mini-textbox" required="true" />
</td>
<th class="formTitle">编号</th>
<td class="formValue">
<input style="width: 100%;" name="F_RealName3" class="mini-textbox" placeholder="请输入名称" />
</td>
</tr>
</table>
</div>
<div title="附件上传" id="settings">
<table id="t5" class="form" cellpadding="0" cellspacing="0" border="0" style="margin: 5px 0px 5px 0px;">
<col width="80px" />
<col width="50%" />
<col width="80px" />
<col width="50%" />
<tr>
<th class="formTitle">名称</th>
<td class="formValue">
<input style="width:100%" name="FullName5" class="mini-textbox" required="true" />
</td>
<th class="formTitle">编号</th>
<td class="formValue">
<input style="width:100%" name="F_RealName5" class="mini-textbox" placeholder="请输入名称" />
</td>
</tr>
<tr>
<th class="formTitle">负责人</th>
<td class="formValue">
<input style="width:100%" name="Corporate5" class="mini-textbox" />
</td>
<th class="formTitle">手机</th>
<td class="formValue">
<input style="width:100%" name="Corporate5" class="mini-textbox" />
</td>
</tr>
</table>
</div>
</div>
</div>
</form>
<a class="layui-layer-btn1 btn btn-primary btn-sm">保存</a>
<script type="text/javascript">
mini.parse();
var form = new mini.Form("form1");
function CheckForm() {
form.validate();
if (!form.isValid()) {
alert("验证未通过，请检查");
return;
}
}
</script>
</body>
</html>
作者:
dforce
时间:
2017-2-23 14:32:16
隐藏的控件不验证，这是基本规则。
最新版本表单控件新增了forceValidate属性，设置true，隐藏状态下也会验证。
欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)
Powered by Discuz! X2