Layui弹出层的yes/btin实现表单验证

2023-11-04

我们都知道layui的弹出层的btn属性生成的按钮,没办法实现弹出层内部的form验证成功后再执行相应操作。
我的方法是,在弹出层写一个隐藏按钮,一个隐藏的input和form.on方法,和自定义验证方法或者layui的验证方法,我使用的是layui的验证方法。
1、在弹出层内部建一个隐藏按钮

<button id="formVerify" class="layui-btn" lay-submit lay-filter="formVerify" style="display: none">添加</button>

2、在弹出层内部建需要验证的input

  <input type="text" id="orderNumber" name="orderNumber" lay-verify="required" placeholder="请输入订单号" autocomplete="off" class="layui-input">

注:lay-verify的required就是验证不能为空。内置方法。
3、在弹出层内部建一个隐藏的input

<input type="text" id="dis" name="dis" value="no" style="display:none" class="layui-input">

注:value是设置input的默认值
4、在弹出层内部建一个form.on的方法

 form.on('submit(formVerify)',function (data) {

            $("#dis").attr("value","yes");
           return false;
         });

注:这个是验证成功后才会执行下面的操作,
去修改隐藏iinput的默认值。
一定要renturn false,这样可以阻止表单提交。
5、在父层的open的yes里面写

 // 获取iframe层的body
 var body = layer.getChildFrame('body', index);//巧妙的地方在这里哦
   body.find('#formVerify').click();//点击提交验证按钮。

在这里插入图片描述
6、在父层获取隐藏iunput的默认值

body.contents().find("#dis").val()=="yes"

在这里插入图片描述
看到这里,相信大家已经知道了,我的想法。
如果隐藏input的值是yes,也就是说通过了表单验证,这样就可以进行ajax了
最后,如果想成功后,关闭弹出框,就可以在if的最后加:layer.close(index);

我的方法可能很lou,但也能实现想要的。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Layui弹出层的yes/btin实现表单验证 的相关文章

随机推荐

  • Java设计模式:23种设计模式全面解析,墙都不扶就服你

    命令模式 将命令请求封装为一个对象 使得可以用不同的请求来进行参数化 迭代器模式 一种遍历访问聚合对象中各个元素的方法 不暴露该对象的内部结构 观察者模式 对象间的一对多的依赖关系 仲裁者模式 用一个中介对象来封装一系列的对象交互 备忘录模
  • 关于定时任务简单小脚本

    1 每4小时备份一次 etc 目录至 backup目录中 保存的文件名称格式为 etc yyyy mm dd HH tar xz crontab e 进入编辑模式 tar JcPf创建文档并保存为 xz格式 0 4 tar JcPf bac
  • 深入理解数据结构——图

    include
  • SAC(Soft Actor Critic)学习记录

    SAC Soft Actor Critic 学习记录 基本介绍 SAC Soft Actor Critic 算法在近年来受到了许多的关注 得到了不少深度强化学习研究者的好评 这篇文章主要包含的内容有SAC算法的理论分析和核心代码实现 与许多
  • ProGan,关键创新在于渐进式训练

    2018年 NVIDIA首次用ProGAN解决了这一挑战 研究人员一直无法生成高质量的大图像 例如1024 1024 ProGAN的关键创新在于渐进式训练 它首先用极低分辨率的图像 如4 4 训练生成器和鉴别器 然后每次增加一个更高分辨率的
  • Float比较大小

    目录 起因 结论 科学计数法 十进制转二进制 整数 基本 二进制科学计数法 总结 小数 基本 二进制科学计数法 总结 IEEE754标准存储 基本 起因 在阅读 阿里巴巴开发手册 时发现了一句话 强制 浮点数之间的等值判断 基本数据类型不能
  • Linux(查看服务cpu核数和内存)

    linux服务器中最重要的两个配置是CPU和内存 那么怎么开始查看CPU核数和内存 以及使用情况 是日常运维中使用最多的操作 查看linux服务器cpu最简单的命令是 cat proc cpuinfo 查看linux服务器cpu最简单的命令
  • TCP常见面试题

    1 画出TCP的报头 2 说一下TCP的三次握手过程 3 为什么TCP握手需要三次 TCP是可靠的传输控制协议 三次握手能保证数据可靠传输又能提高传输效率 如果TCP的握手是两次 lt 1 gt 如果client发给server的SYN报文
  • Spring 事务事件控制 解决业务异步操作解耦 TransactionSynchronizationManager Transaction

    场景 在业务中 经常需要在执行数据库操作后 事务提交完成 发送消息或事件来异步调用其他组件执行相应的业务操作 比如 用户注册成功后 发送激活码或激活邮件 如果用户保存后就执行异步操作发送激活码或激活邮件 但是前面用户保存后发生异常 数据库进
  • kmeans聚类簇个数选择

    借助sklearn库实现kmeans聚类和轮廓系数计算 from sklearn cluster import KMeans from sklearn metrics import silhouette score K range 2 20
  • 使用Python与Stm32进行通信

    方法 利用python的serial函数库与STM32进行通信 将Stm32用USB连接到电脑 打开设备管理器查看端口 端口为COM3 写下Python程序 import serial 连接串口 serial serial Serial C
  • python Typing模块-类型注解

    写在篇前 typing 是python3 5中开始新增的专用于类型注解 type hints 的模块 为python程序提供静态类型检查 如下面的greeting函数规定了参数name的类型是str 返回值的类型也是str def gree
  • STL几种常见类型的比较

    这里主要是想要比较几种容器的性能 至于他们的接口不在考虑范围 Vector 相当于一个数组 在内存中分配一块连续的内存空间进行存储 支持不指定vector大小的存储 STL内部实现时 首先分配一个非常大的内存空间预备进行存储 即capaci
  • Mac pycharm 导入pyspark

    转载于 点击打开链接 1 前提 已经安装了pycharm 下载了spark 官网下载 我下的是spark 2 1 1 bin hadoop2 7 tgz 解压缩后为文件夹spark 2 1 1 bin hadoop2 7 我将文件放在了 A
  • C#项目实战|人脸识别考勤

    人脸识别考勤是一种基于人脸识别技术的智能化考勤系统 可以实现快速准确的考勤记录 提高考勤管理的效率和准确性 本文将介绍如何使用C 语言开发人脸识别考勤系统 一 项目概述 本项目使用C 语言 采用人脸识别技术和数据库技术 实现了一个基于人脸识
  • robots.txt 泄漏敏感信息

    robots txt 泄漏敏感信息 漏洞描述 搜索引擎可以通过robots文件可以获知哪些页面可以爬取 哪些页面不可以 爬取 Robots协议是网站国际互联网界通行的道德规范 其目的是保护网站数据和敏感信 息 确保用户个人信息和隐私不被侵犯
  • UVa 120 Stacks of Flapjacks

    Background Stacks and Queues are often considered the bread and butter of data structures and find use in architecture p
  • linux命令之tar -C命令的含义

    C代表change目录的意思 本例中指定解压文件到 opt cloudera manager这个目录下
  • 华为DevEco Device Tool的一个小bug及其解决方法

    今天 尝试烧录hi3516镜像遇到如下错误 正在执行任务 home vboxuser Huawei DevEco Device Tool core deveco venv bin hos run target upload project
  • Layui弹出层的yes/btin实现表单验证

    我们都知道layui的弹出层的btn属性生成的按钮 没办法实现弹出层内部的form验证成功后再执行相应操作 我的方法是 在弹出层写一个隐藏按钮 一个隐藏的input和form on方法 和自定义验证方法或者layui的验证方法 我使用的是l