当前位置: 首页 > 编程笔记 >

防止Layui form表单重复提交的实现方法

彭允晨
2023-03-14
本文向大家介绍防止Layui form表单重复提交的实现方法,包括了防止Layui form表单重复提交的实现方法的使用技巧和注意事项,需要的朋友参考一下

在提交表单数据时,提交按钮为 submit 类型,以layui为js框架时,会重复提交表单数据,为防止这一情况,有效的做法是:

在<form>里面,加上 lay-filter="formConfig" , οnsubmit="return false" , 其中 “formConfig” 为自定义,然后在 提交的按钮事件内:

form.on("submit(formConfig)",function(data){
  return false;
 }); 

具体做法:

1、在form 里面:

   <form class="layui-form" id="addform" name="addform" lay-filter="formConfig" method="post" action="" enctype="multipart/form-data" οnsubmit="return false" > 

   <button type="submit" class="btn btn-primary radius" id="btnSave" >提交</button>

2、在提交的按钮事件:

 $(function(){
  $("#btnSave").click(function(){
     layui.use('form',function(){
        var form=layui.form;
        form.render();
        form.on("submit(formConfig)",function(data){
        return false;
        });
     });

     $.ajax({

       // to do......

     });

   });

以上这篇防止Layui form表单重复提交的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍php 防止表单重复提交两种实现方法,包括了php 防止表单重复提交两种实现方法的使用技巧和注意事项,需要的朋友参考一下 php 防止表单重复提交 由于网络原因,经常出来点了提交按钮,网页没有反应,而进行再次点击。这样就导致后台收到两次提交,从而进行两次处理,本文章向大家介绍php 防止表单重复提交的几种方法 1、前端解决 方法一: 可以通过前端来解决。当用户点了提交按钮之后,先使用

  • 本文向大家介绍一个JavaScript防止表单重复提交的实例,包括了一个JavaScript防止表单重复提交的实例的使用技巧和注意事项,需要的朋友参考一下

  • 问题内容: 我的表单需要服务器处理一些时间。我需要确保用户等待并且不会再次单击按钮来尝试重新提交表单。我尝试使用以下jQuery代码: 当我在Firefox中尝试此操作时,所有功能都被禁用,但是该表单未与应该包含的任何POST数据一起提交。我不能使用jQuery提交表单,因为我需要将按钮与表单一起提交,因为有多个提交按钮,并且我确定POST中包含哪个值使用了哪个按钮。我需要像平常一样提交表单,并且

  • 1、通过JavaScript屏蔽提交按钮(不推荐) 2、给数据库增加唯一键约束(简单粗暴) 3、利用Session防止表单重复提交(推荐) 4、使用AOP自定义切入实现

  • 问题内容: 我有的: 我有一个通过AJAX提交的表格。 我想要的是: 我想防止重复提交。由于仅在成功完成请求后该表单才会消失,因此只要数据库尚未完成数据写入,用户就可以单击“提交”按钮。显然,我不需要。 我尝试过的 我尝试将其添加到“提交”按钮本身中,但是它不起作用。该按钮被禁用,但是没有数据发送。 我也尝试将点击处理程序添加到“提交”按钮。具有与以前相同的效果。实际上没有数据发送到控制器,但是按

  • 本文向大家介绍php表单加入Token防止重复提交的方法分析,包括了php表单加入Token防止重复提交的方法分析的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了php表单加入Token防止重复提交的方法。分享给大家供大家参考,具体如下: Token浅谈 Token,就是令牌,最大的特点就是随机性,不可预测。一般黑客或软件无法猜测出来。 那么,Token有什么作用?又是什么原理呢? Tok