LayUI表单获取不到data的解决办法

前几天用LayUI表单进行AJAX提交的时候发现,function(data)里的data始终无法获取表单里填的值,当时我认为是出BUG了就用了$('#updateform').serialize()来获取表单数据

 	          //form表单 更新员工信息
	  	form.on('submit(form_emp2)', function(data){
			var temp=$('#updateform').serialize();
          // layer.msg(JSON.stringify($('#form1').serialize()));
         // alert(JSON.stringify(temp));
        //  return false;
	  		$.ajax({
	  			url:'<%=basePath%>employ/updateEmployee',
	  			type:'POST',
	  			data:temp,
	  			dataType:'JSON',
	  			success:function(rs)
	  			{
	  				if(rs.code=='10000')
	  				{
	  					layer.msg('更新成功');
	  				    $('.employpage').jsGrid("loadData");
	  				     layer.close(openid);
	  				     openid=null;
	  				}	
	  				else
	  				{
	  					layer.msg('更新失败');	
	  				}
	  			},
	  			error:function()
	  			{
	  				layer.msg("test")
	  			}
	  		});

	  	    return false;
  
	  	  });
	  	  
但是今天问题又来了,我发现我的LayUI表单想要添加一个不能为空的验证居然添加不上去,我的input 如下:

<input name="depName" id="departName" placeholder="请输入所在部门"  required   lay-verify="required"  class="layui-input" οnclick="showDep();" ></input>
由此我想到了前几天的获取不到data的事情,考虑到可能有所关联,于是又开始了研究。后来 终于发现原因是我的form表单缺少了class="layui-form"

LayUI 是根据class来查找form表单的,缺少了这个class 自然data就获取不到 了。




  • 4
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
好的,关于 layui 表单校验,你可以参考以下代码: ```html <form class="layui-form" action=""> <div class="layui-form-item"> <label class="layui-form-label">用户名</label> <div class="layui-input-block"> <input type="text" name="username" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">密码</label> <div class="layui-input-block"> <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> <script> //JavaScript代码区域 layui.use('form', function(){ var form = layui.form; //监听提交 form.on('submit(formDemo)', function(data){ layer.msg(JSON.stringify(data.field)); return false; }); }); </script> ``` 其中,`lay-verify` 属性用于指定校验规则,`required` 表示必填项。在 JavaScript 中,我们可以通过 `form.verify()` 方法来自定义校验规则。例如: ```javascript //自定义校验规则 form.verify({ username: function(value, item){ //value:表单的值、item:表单的DOM对象 if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){ return '用户名不能有特殊字符'; } if(/(^\_)|(\__)|(\_+$)/.test(value)){ return '用户名首尾不能出现下划线\'_\''; } if(/^\d+\d+\d$/.test(value)){ return '用户名不能全为数字'; } }, password: [/^[\S]{6,12}$/,'密码必须6到12位,且不能出现空格'] }); ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值