<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html>

<%

    String path = request.getContextPath();

%>

<html>

<head>

<link rel="stylesheet" type="text/css"

    href="<%=path%>/script/easyUI-1.4/themes/bootstrap/easyui.css">

<link rel="stylesheet" type="text/css"

    href="<%=path%>/script/easyUI-1.4/themes/icon.css">

<script type="text/javascript"

    src="<%=path%>/script/easyUI-1.4/jquery-1.8.3.min.js"></script>

<script type="text/javascript"

    src="<%=path%>/script/easyUI-1.4/jquery.easyui.min.js"></script>

<script type="text/javascript"

    src="<%=path%>/script/easyUI-1.4/locale/easyui-lang-zh_CN.js"></script>

</head>

<script type="text/javascript">

    jQuery(function() {

        $('#loginAndRegDialog').dialog({

            title : '用户登录',

            width : 300,

            height : 200,

            closable : false,

            cache : false,

            modal : true,

            buttons : "#btn"

        });

        $("#login").bind('click', function() {

            console.info("login");

        });

        $('#form1').form({

            url :"<%=path%>/userAction/save",

            onSubmit : function() {

                //在提交之前触发，返回false可以终止提交。

                console.info("onsubmit方法")

            },

            success : function(data) {

                //在表单提交成功以后触发

                console.info("返回值")

            }

        });

        $("#login").bind('click',function(){

                $('#form1').submit();

        });

    });

</script>

<body>

    <div id="loginAndRegDialog">

        <form id="form1" method="post" class="easyui-form">

            <div style="margin-top: 20px; margin-left: 60px; margin-right: 60px;">

                <input class="easyui-textbox" name="username"

                    data-options="iconCls:'icon-man',validType:'length[5,10]',prompt:'用户名'"

                    style="width: 100%; height: 35px">

            </div>

            <div style="margin-top: 20px; margin-left: 60px; margin-right: 60px;">

                <input class="easyui-textbox" name="password"

                    data-options="iconCls:'icon-man',validType:'length[5,10]',prompt:'密码'"

                    style="width: 100%; height: 35px">

            </div>

            <div id="btn">

                <a id="login" class="easyui-linkbutton"

                    data-options="iconCls:'icon-ok'" style="width: 30%; height: 32px">登录</a>

                <a id="reg" class="easyui-linkbutton"

                    data-options="iconCls:'icon-edit'"

                    style="width: 30%; height: 32px; margin-right: 55px;">注册</a>

            </div>

        </form>

    </div>

</body>

</html>

（十二）easyUI之表单和验证完成登录页面的更多相关文章

  1. 五十二：WTForms表单验证之基本使用

    作用:1.做表单验证,把用户提交的数据验证是否合法2.做模板渲染 安装:pip install wtforms 表单验证1.自定义一个表单类,继承wtforms.Form2.定义好需要验证的字段,字段 ...

  2. 单点登录(十二)-----遇到问题-----cas启用mongodb验证方式登录后没反应-pac4j-mongo包中的MongoAuthenticatInvocationTargetException

    cas启用mongodb验证方式登录后没反应 控制台输出 2017-02-09 20:27:15,766 INFO [org.jasig.cas.authentication.MongoAuthent ...

  3. HTML基础：用表单写一个简易登录页面

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. easyui表单多重验证，动态设置easyui控件

    要实现的功能:在做添加学生信息的时候,利用easyui的验证功能判断 学号是否重复和学号只能为数字 最终效果如下图: 但在做这个的过程中,遇到了一系列的问题: 扩展validatebox的验证方法,最 ...

  5. JaveWeb 公司项目（4）----- Easyui的表单验证

    前面三篇博文讲述的是界面的搭建和数据的传输,可以看出目前我做的这个小项目已经有了一个大体的雏形,剩下的就是细节部分的打磨和一些友好的人机交互设计,今天做的是表单的验证,作为初学者,着实花了一番功夫,所 ...

  6. 表单（上）EasyUI Form 表单、EasyUI Validatebox 验证框、EasyUI Combobox 组合框、EasyUI Combo 组合、EasyUI Combotree 组合树

    EasyUI Form 表单 通过 $.fn.form.defaults 重写默认的 defaults. 表单(form)提供多种方法来执行带有表单字段的动作,比如 ajax 提交.加载.清除,等等. ...

  7. EasyUI加zTree使用解析 easyui修改操作的表单回显方法 验证框提交表单前验证 datagrid的load方法

    带参提交一次查询,从服务器加载新数据.这是一个神奇的方法 $('#dg').datagrid('load',{ code: '01', name: 'name01' }); easyui修改操作的回显 ...

  8. ajax提交表单无法验证easyui的验证选项（比如required等）

    在实际开发中,遇到ajax方式提交表单没法验证easyui的验证选项,这对实际用户体验造成了很大的困扰.当然,这也是理所当然的事情.   解决办法:使用jquery中ajax的beforeSend事件 ...

  9. [Swift通天遁地]二、表格表单-(18)快速应用多种预定义格式的表单验证

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

随机推荐

  1. Git如何永久删除某个重要文件文件或文件夹 (包括历史记录) 强制

    有些时候不小心上传了一些敏感文件(例如密码), 或者不想上传的文件(没及时或忘了加到.gitignore里的), 而且上传的文件又特别大的时候, 这将导致别人clone你的代码或下载zip包的时候也必 ...

  2. pytest 基本用法

    1.断言用assert,可以进行==,!=,+,-,*,/,<=,>=,is True.False,is not True.False ,in ,not in 等判断. import py ...

  3. pytorch中的学习率调整函数

    参考:https://pytorch.org/docs/master/optim.html#how-to-adjust-learning-rate torch.optim.lr_scheduler提供 ...

  4. 隐藏Nginx、Apache、PHP的版本号

    Nginx: 在nginx配置文件nginx.conf中,加入以下代码: server_tokens off; Apache: 在apache配置文件httpd.conf中,加入以下代码: Serve ...

  5. （九）Centos之搜索命令whereis、which和字符串搜索命令grep

    一.Centos之命令搜索命令whereis与which 1.1 whereis 命令名(搜索命令所在路径及帮助文档所在位置) 选项: -b :只查找可执行文件位置 -m:只查找帮助文件 1.2 wh ...

  6. （五）Centos之目录处理命令

    一.目录处理命令 linux中 关于目录 有几个重要概念:一个是 / 根目录  还有一个当前用户的家目录 比如 root用户的家目录是 /root  ,普通用户的家目录是/home/xxx 下,如下图 ...

  7. win7下Excel2003/2010 同时打开多个独立窗口

    最近新买了本本,装了许多软件,由于许多苦逼的原因系统被我搞的乱乱的,不得已重装了几次,话说之前我用的都是台式机,用得蛮顺的,但是在重装系统之后发现自己装的Office 2003 在打开Excel 文档 ...

  8. EasyNetQ使用(六)【多态发布和订阅,消息版本控制】

    你能够订阅一个接口,然后发布基于这个接口的实现. 让我们看下一个示例.我有一个接口IAnimal和两个实现Cat和Dog: public interface IAnimal { string Name ...

  9. 利用 AWS 无服务架构之语音合成

    目录 一.架构图 二.服务部署 2.1.创建 DynamoDB 表 2.2.创建 S3 2.2.1 静态网页存储桶 2.2.2.音频存储桶 2.3.创建 SNS Topic 2.4.为 Lambda ...

  10. React16+配置打包目录

    在学习react的时候,肯定最终都要用脚手架,对比了手写配置webpack(比较费劲).generator-react-webpack(打不开官方文档……),最终还是选择了react官方的create ...