zoukankan      html  css  js  c++  java
  • (十二)easyUI之表单和验证完成登录页面

    <%@ 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=" 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=" 100%; height: 35px">
                </div>
                <div id="btn">
                    <a id="login" class="easyui-linkbutton"
                        data-options="iconCls:'icon-ok'" style=" 30%; height: 32px">登录</a>
                    <a id="reg" class="easyui-linkbutton"
                        data-options="iconCls:'icon-edit'"
                        style=" 30%; height: 32px; margin-right: 55px;">注册</a>
                </div>
            </form>
    
        </div>
    </body>
    </html>

     

  • 相关阅读:
    一些常用编程经验
    “一键GHOST”系统备份与还原(icmzn)
    office2010安装不成功提示缺少MSXML 6.10.1129.0?
    python 的几种启动方式
    win7 环境安装Python + IDE(vs2010)开发
    U盘单个文件最大4G限制问题
    第一百零三节,JavaScript对象和数组
    第一百零二节,JavaScript函数
    第一百零一节,JavaScript流程控制语句
    第一百节,JavaScript表达式中的运算符
  • 原文地址:https://www.cnblogs.com/shyroke/p/7783574.html
Copyright © 2011-2022 走看看