Layui Form 自定义验证的实例代码

1.前台页面

 <div class="layui-form-item">

  <label class="layui-form-label">BOM编号</label>
  <div class="layui-input-block">
  <input type="text" class="layui-input" name='code'
   lay-verify="required|unique">
  </div>
 </div>

2.前台Js

需要引用layui.js文件

<script type="text/javascript">
 var form = layui.form;
 form.verify({
  'unique' : function(value, item) {
  var checkValue = value.trim();
  var checkResult='';
  $.ajax({
   url : '/bomManage/checkBomCode',
   type : 'POST',
   data : {
   "newBomCode" : checkValue
   },
   datatype : 'json',
   async : false,
   success : function(result) {
   if (!result) {
    checkResult='BOM编号重复'
   }
   },
   error : function() {
   kok.message("BOM编号验证失败")
   }
  });
  return checkResult
  }
 })

 </script>

3.后台逻辑处理

 @Override
 public boolean checkBomCode(String newBomCode) {
 BdBomVersionExample example=new BdBomVersionExample();
 Criteria criteria = example.createCriteria();
 criteria.andCodeEqualTo(newBomCode.trim());
 List<BdBomVersion> checks = bdBomVersionMapper.selectByExample(example);
 boolean checkValue=true;
 if(checks.size()>0){
  checkValue=false;
 }
 return checkValue;
 }

以上这篇Layui Form 自定义验证的实例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • layui在form表单页面通过Validform加入简单验证的方法

    form简单验证 <input type="text" name="email" datatype="e" ignore="ignore" placeholder="请输入邮箱" autocomplete="off" class="layui-input"> datatype="e"验证邮箱 ignore="ignore&qu

  • 在layui中使用form表单监听ajax异步验证注册的实例

    今天给大家介绍的是当下很流行的框架layui中的一个小案例.就是form表单监控提交并且使用ajax异步提交验证数据.在layui中我们想使用哪个模块就要layui.use('form',function{});这种形式要引用form内置模板,下面是HTML全部代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>注册</title> <

  • layui自定义验证,用ajax查询后台是否有重复数据,form.verify的例子

    用layui表单自定义验证,ajax查询后台验证,form.verify和ajax组合时,尝试更改了几次方案,遇到的问题: 1.有时点击两次submit才会提示验证结果: 2.有时后台返回结果没问题,但不提示验证结果,查了查网上资料后,发现是在ajax最后return时出的问题,ajax改为同步,最后把验证提示信息return,而不能在success或error中return. form.verify({ account: function(value, item){ //value:表单的值.

  • Layui Form 自定义验证的实例代码

    1.前台页面 <div class="layui-form-item"> <label class="layui-form-label">BOM编号</label> <div class="layui-input-block"> <input type="text" class="layui-input" name='code' lay-verify=&

  • 使用Vue动态生成form表单的实例代码

    具有数据收集.校验和提交功能的表单生成器,包含复选框.单选框.输入框.下拉选择框等元素以及,省市区三级联动,时间选择,日期选择,颜色选择,文件/图片上传功能,支持事件扩展. 欢迎大家star学习交流:github地址 示例 https://raw.githubusercontent.com/xaboy/form-create/dev/images/sample110.jpg 安装 npm install form-create OR git clone https://github.com/xa

  • vue中使用element-ui进行表单验证的实例代码

    element-ui 中验证 一.简单逻辑验证(直接使用rules) 实现思路 •html中给el-form增加 :rules="rules" •html中在el-form-item 中增加属性 prop="名称" •js中直接在data中定义rules:{} •html部分 <el-form ref="form" :rules="rules" :model="form" label-width=&q

  • jQuery完成表单验证的实例代码(纯代码)

    废话不多说了,直接给大家贴代码了,具体代码如下所示: <!doctype html> <head> <meta charset=utf-8" /> <title>表单验证</title> <link href="css/style1.css" rel="external nofollow" rel="stylesheet" type="text/css"

  • jQury Ajax使用Token验证身份实例代码

    因为最近做了几个后台,所以经常会涉及到Token验证身份操作后台,所以这里记录一个如何向后台传请求头和Token. success:function(dat){ console.log(dat); if(dat.code==1){ sessionStorage.setItem('token',dat.data.access_token); //这里设置缓存存储Token sessionStorage.setItem('user',userName); location.href = "index

  • 表单验证正则表达式实例代码详解

    表单验证正则表达式具体内容如下所示: 首先给大家解释一些符号相关的意义 1.  /^$/ 这个是个通用的格式. ^ 匹配输入字符串的开始位置:$匹配输入字符串的结束位置 2. 里面输入需要实现的功能. * 匹配前面的子表达式零次或多次:        + 匹配前面的子表达式一次或多次:        ?匹配前面的子表达式零次或一次:        \d  匹配一个数字字符,等价于[0-9] 下面通过一段代码给大家分析表单验证正则表达式,具体代码如下: <!DOCTYPE html> <h

  • Ajax+Struts2实现验证码验证功能实例代码

    众所周知,验证码在我们的生活中都是非常常见的,很多公司都在各种折腾各种各样的验证码,这里简要的用一个小案例来实现验证码的功能(ps:其实我挺讨厌验证码这个东西的). 今天分享的是通过ajax来动态的验证验证码输入是否正确.我们这里采用的是ajax+struts2来做的这个验证. 我们新建一个web工程.然后需要导入struts的相应包.之后我们需要写一个类来生成验证码. 这里命名为01_image.jsp,这类的主要功能就是生成验证码,里面是各种画线条,随机数字等,我这里设置的是5个数字的验证,

  • EasyUI在表单提交之前进行验证的实例代码

    使用EasyUi我们可以在客户端表单提交之前进行验证,过程如下:只需在onSubmit的时候使用return $("#form1").form('validate')方法即可,EasyUi中form模块中的from('validate')方法会自行对我们指定的表单中required=true等需要验证的的元素进行验证,但有不通过的元素时返回一个false; $("#form").form({ url: 'login.ashx', onSubmit: function

  • Android字段验证的实例代码

    先给大家展示效果图: package com.example.walkerlogin1; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; import android.widget.EditText; import android.widge

  • vue elementui el-form rules动态验证的实例代码详解

    一.介绍 简介:在使用elementUI el-form 中,对于业务不同的时候可能会产生不同表单结构,但是都是存在同一个表单控件el-form中. 图片介绍: 1.在用户选择单选或多选时会有A,B,C,D,E五个选项 2.在用户选择简答题时只会题干,答案以及解析选项(主要是通过v-if来进行判断) 问题引入:当用户选择不同的题库时会产生不同的form表单选项,这个时候在进行表单提交验证的时候就需要根据不同试题类型进行判断,这个时候就需要两个rules来动态进行表单校验. 解决方法:在页面加载的

随机推荐