专栏首页kwcodeeasyui表单提交验证form

easyui表单提交验证form

方式一,不需要考虑jquery.easyui.min.js版本

 <script>
        $(function () {
            //针对 设置 novalidate:true 
            $('.validatebox-text').bind('blur', function () {
                $(this).validatebox('enableValidation').validatebox('validate');
            });
            $("#btn_ok").click(function () {
                //启用
                $('.validatebox-text').validatebox('enableValidation').validatebox('validate')
                $.messager.progress(); // 显示进度条 
                var b = $("#ff").form('validate');//验证
                if (b) {
                    $.messager.progress('close'); // 如果提交成功则隐藏进度条
                }
                else { $.messager.progress('close'); } // 如果提交成功则隐藏进度条 }
            });
        });

    </script>
<div id="ff">
        <input class="easyui-textbox  easyui-validatebox" type="text" name="name" data-options="required:true,novalidate:true" />
        <input style="width: 150px;" class="easyui-textbox   easyui-validatebox" data-options="required:true,validType:'length[4,20]',missingMessage:'用户名不能为空,请输入用户名',invalidMessage:'用户名的长度为4-20位'" />
        <input class=" textbox easyui-validatebox" data-options="required:true,validType:'email' ,missingMessage:'用户名不能为空,请输入用户名',invalidMessage:'邮件'" />
    </div>
    <input id="btn_ok" type="button" value="确定" /> 

  方式2,暂时发现1.3.6版本一下不支持

<script>
        function submitForm() {
            $('#ff').form('submit', {
                onSubmit: function () {
                    var b = $(this).form('enableValidation').form('validate');
                    if (b) {
                        alert("成功");
                    }
                    else { alert("不成功"); }
                }
            });
        }
        $(function () {
            $("#btn_ok").click(function () {
                var b = $('#ff').form("enableValidation").form('validate');
                if (b) {
                    alert("成功");
                }
                else { alert("不成功"); }
            });
        });
    </script>
<body>
    <div id="ff"  class="easyui-form" data-options="novalidate:true">
        <input class="easyui-textbox" type="text" name="email" data-options="required:true" />
    </div>
    <div style="text-align: center; padding: 5px">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()">Submit</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" id="btn_ok">OK</a>
    </div>


</body>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 使用Cache缓存

    存放位置:服务器内存,用于频繁访问且不轻易更改的内容缓存。 string CacheKey = "CT1"; //检索指定项, object objModel ...

    纯粹是糖
  • C# 读取指定文件夹下所有文件

    #region 读取文件 //返回指定目录中的文件的名称(绝对路径) string[] files = S...

    纯粹是糖
  • 微信小程序调用接口返回数据或提交数据

    由于小程序发起网络请求需要通过 wx.request 文档地址 https://mp.weixin.qq.com/debug/wxadoc/dev/api/ne...

    纯粹是糖
  • Swift API 设计指南(下)

    一般来说,默认参数比方法族(method families)更可取,因为它减轻了 API 使用者的认知负担。

    Sheepy
  • nodejs创建HTTP服务器与前端通信示例(多demo)

    前面几篇都在复习nodejs创建HTTP服务器的若干知识点,本篇将使用原生AJAX和nodejs的HTTP服务器配合写几个DEMO,加深运用理解,也方便时间长回...

    前端_AWhile
  • ApacheTomcat 8 9 安全配置与高并发优化

    telnet localhost 8005 然后输入 SHUTDOWN 就可以关闭 Tomcat,为了安全我们要禁用该功能

    拓荒者
  • 使用FreeIPA为CDH6.3集群部署安全

    Cloudera从CM6.3版本开始,引入了Red Hat IdM来做整个集群的认证,Red Hat IdM对应的软件为FreeIPA,在本文中描述如何使用Fr...

    大数据杂货铺
  • RequestParam与RequestBod等参数注解简析

    该注解常用来处理Content-Type: 不是application/x-www-form-urlencoded和multipart/form-data编码的...

    汐楓
  • 高性能 RPC 框架 Dubbo 从入门到深入(详细原理介绍限时9.99)

    课程简介 整体来说,一个公司业务系统的演进流程基本都是从单体应用到多应用。在单体应用时,不同业务模块相互调用直接在本地 JVM 进程内就可以完成,而变为多个应...

    加多
  • Hadoop数据分析平台实战——170Oozie介绍及环境搭建离线数据分析平台实战——170Oozie介绍及环境搭建

    离线数据分析平台实战——170Oozie介绍及环境搭建 Oozie介绍 Oozie是一个工作流引擎服务器,用于运行Hadoop Map/Reduce和Hive等...

    Albert陈凯

扫码关注云+社区

领取腾讯云代金券