http://www.cnblogs.com/tangge/p/3214496.html

1.页面引用.

jquery,easyui,主题easyui.css,图标ico.css,语言zh_CN.js

    <script src="Scripts/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>

    <script src="Scripts/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>

    <link href="Scripts/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet" />

    <link href="Scripts/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" />

    <script src="Scripts/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"></script>

2.parser组件panel组件

<body>

    <div id="p" class="easyui-panel" title="My Panel"

        style="width: 500px; height: 150px; padding: 10px; background: #fafafa;"

        data-options="iconCls:'icon-save',closable:true,

                collapsible:true,minimizable:true,maximizable:true">

        <p>panel content.</p>

        <p>panel content.</p>

    </div>

    <input type="button" name="" onclick="$('#p').panel('open')" value="显示" />

    <input type="button" name="" onclick="$('#p').panel('close')" value="关闭" />

    <input type="button" name="" onclick="$('#p').panel('destroy')" value="销毁" />

</body>

3.Form表单的验证(validate)提交

隐藏行号复制代码？index.html

```
<!DOCTYPE html>
```

<html xmlns="http://www.w3.org/1999/xhtml">

```
<head>
```

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

```
    <title></title>
```

    <script src="Scripts/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>

    <script src="Scripts/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>

    <link href="Scripts/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet" />

    <link href="Scripts/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" />

    <script src="Scripts/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"></script>

```
    <script type="text/javascript">
```
```
        var LoginAndRegDialog;
```
```
        var LoginInputForm;
```
```
        $(function () {
```
```
            //对话框dialog
```

            LoginAndRegDialog = $("#LoginAndRegDialog").dialog({

```
                closable: false,
```
```
                modal: true,
```
```
                buttons: [{
```
```
                    text: '登录',
```
```
                    iconCls: 'icon-ok',
```

                    handler: function () {

                        //***先验证（根据自己的需求）

                        if (LoginInputForm.form('validate')) {

                            //表单form提交

                            LoginInputForm.submit();

```
                        }
```
```
                    }
```
```
                }, {
```
```
                    text: '取消',
```

                    handler: function () {

                        $('#LoginInputForm').form('clear');

```
                    }
```
```
                }]
```
```
            });
```
```
            
```
```
            //表单的提交要求
```

            LoginInputForm = $('#LoginInputForm').form({

```
                url: '/Login.ashx',
```
```
                onSubmit: function () {
```
```
                    // do some check   
```

                    // return false to prevent submit;

```
                },
```

                success: function (data) {

```
                    //alert(data);
```
```
                    console.info(data);
```
```
                    $.messager.show({
```

                        title: '提示',

```
                        msg: data
```
```
                    })
```
```
                },
```
```
            });
```
```
        })
```
```
    </script>
```
```
</head>
```
```
<body>
```

    <div id="LoginAndRegDialog" title="用户登录" style="width: 250px; height: 200px;">

        <form id="LoginInputForm" method="post">

            <table style="margin-top: 20px">

```
                <tr>
```

                    <th>用户名：</th>

```
                    <td>
```

                        <!--直接使用验证规则class="easyui-validatebox"-->

                        <input name="name" class="easyui-validatebox" data-options="required:true" />

```
                    </td>
```
```
                </tr>
```
```
                <tr>
```

                    <th align="right">密码：</th>

```
                    <td>
```

                        <input name="password" type="password" />

```
                    </td>
```
```
                </tr>
```
```
            </table>
```
```
        </form>
```
```
    </div>
```
```
</body>
```
```
</html>
```

隐藏行号复制代码？Login.ashx

 public void ProcessRequest(HttpContext context)

```
        {
```

            context.Response.ContentType = "text/html";

            string username = context.Request["name"];

            string password = context.Request["password"];

            context.Response.Write(username + "你好,你的密码是：" + password);

```
           
```
```
        }
```

jQuery EasyUI 1.3 中文帮助手册

easyUI1.3.chm.7z

easyui 入门的更多相关文章

EasyUI学习(一)——EasyUI入门
EasyUI学习总结(一)——EasyUI入门一.EasyUI下载 EasyUI官方下载地址:http://www.jeasyui.com/download/index.php,目前最新的版本是:j ...
EasyUI学习总结(一)——EasyUI入门
一.EasyUI下载 EasyUI官方下载地址:http://www.jeasyui.com/download/index.php,目前最新的版本是:jQuery EasyUI 1.4.1
Easyui入门视频教程第11集---Window的使用
目录 Easyui入门视频教程第11集---Window的使用 Easyui入门视频教程第10集---Messager的使用 Easyui入门视频教程第09集---登录完善图标自定义 ...
Easyui入门视频教程第10集---Messager的使用
Easyui入门视频教程第10集---Messager的使用 <script type="text/javascript"> function show(){ $.m ...
Easyui入门视频教程第09集---登录完善图标自定义
目录 ----------------------- Easyui入门视频教程第09集---登录完善图标自定义 Easyui入门视频教程第08集---登录实现 ajax button的使用 ...
Easyui入门视频教程第08集---登录实现 ajax button的使用
目录 ----------------------- Easyui入门视频教程第09集---登录完善图标自定义 Easyui入门视频教程第08集---登录实现 ajax button的使用 ...
Easyui入门视频教程第06集---Layout初始化和属性方法使用
目录 ----------------------- Easyui入门视频教程第09集---登录完善图标自定义 Easyui入门视频教程第08集---登录实现 ajax button的使用 ...
Easyui入门视频教程第05集---Easyui复杂布局
目录 ----------------------- Easyui入门视频教程第09集---登录完善图标自定义 Easyui入门视频教程第08集---登录实现 ajax button的使用 ...
Easyui入门视频教程第04集---Easyui布局
目录目录 ----------------------- Easyui入门视频教程第09集---登录完善图标自定义 Easyui入门视频教程第08集---登录实现 ajax button的 ...
Easyui入门视频教程第03集---Easyui布局
Easyui入门视频教程第03集---Easyui布局目录 ----------------------- Easyui入门视频教程第09集---登录完善图标自定义 Easyui入门视频教 ...

随机推荐

使用Obsolete特性来标记方法过时或弃用
我们在维护一些老的系统的时候,经常会遇到某个方法不再使用的情况,我们又不能直接将其删除,因为系统中可能还有很多地方有引用它,所以比较安全保险的做法是,使用Obsolete特性来标记它过时或弃用.如下代 ...
使用了Windows Live Writer 写的博客
<为什么标签不能正确的显示> 重新设置了之后再看看停用了一些插件! 偶然看到很多Blog都在说:“尝试连接到您的日志时出错:服务器响应无效 – 从日志服务器接收的对 blogger. ...
js基础之弹性运动（四）
一.滑动菜单.图片 var iSpeed=0;var left=0;function startMove(obj,iTarg){ clearInterval(obj.timer);//记得先关定时器 ...
大过年的，不下班的，上个Android文件操作类（内部存储和sd卡均可）
package com.kkdiangame.UI.res; import java.io.ByteArrayOutputStream; import java.io.File; import jav ...
Oracle连接出现TNS：no listener或者ORA-12514: TNS:listener does not currently know
1.Message 850 not found; No message file for product=network, facility=NL 提示框:TNS:no listener 解决办法: ...
JDBC 连接池
数据库连接池(connection pool) JDBC数据库连接池的必要性在使用开发基于数据库的web程序时,传统的模式基本是按以下步骤: 在主程序(如servlet.beans)中建立数据库连接 ...
“更高效率：标准化+简约风+移动化”--K2 BPM老客户交流会
主题:工作流主数据标准化和移动工作流带来的企业沟通建设机会嘉宾:李瑞延(盛大网络IT总监) 公司管理需要更好的工作流 -为决策提供依据通过对各级业务公司各类流程数据的获取与分析,为管理决策提供必要 ...
maven的入门hello world
编写pom pom.xml是maven的核心.Project Object Model,定义了项目的基本信息,用于描述项目如何构建,项目依赖等. 首先,新建hello-world文件夹,新建pom.x ...
C++学习之静态成员
一.静态数据成员 C++允许将类的数据成员定义为静态成员.静态数据成员是属于类的,整个类只有一个备份,相当于类的全局变量,能够被该类的所有对象共用. 1.静态成员的声明在类数据成员的声明前加上关键字 ...
红帽中出现”This system is not registered with RHN”的解决方案
原因是你的linux没有在红帽网络上注册,所以无法下载上面的软件包,替代方案可以使用centos. 下面介绍下使用centos 的流程 1.卸载rhel的默认安装的yum包查看yum包rpm -qa| ...

easyui 入门

1.页面引用.

jquery,easyui,主题easyui.css,图标ico.css,语言zh_CN.js

2.parser组件panel组件

3.Form表单的验证(validate)提交

easyui 入门的更多相关文章

随机推荐

热门专题