六 13

jQuery EasyUI: Tutorial 教程 及中文教程 索引列表

easyUI中文教程 9 Comments »

Tutorial

Intruduction 介绍

This tutorial aims to use easyui framework to demonstrate how to create your web page easily.
First of all, you need to include some js and css file:
（本教程旨在演示如何轻松利用easyui框架来的创建自己的网页。
首先，你需要加入一些js和css文件：）
<link rel=“stylesheet” type=“text/css” href=“../themes/default/easyui.css”>
<script type=“text/javascript” src=“../jquery-1.4.2.min.js”></script>
<script type=“text/javascript” src=“../jquery.easyui.min.js”></script>
easyui predefines some icon CSS class which can show background image(16×16). If you wish to use it you need to include:
（easyui CSS类预定义一些图标，可以显示背景图片（16像素 x 16像素）。如果你想使用它，你必须加入：）
<link rel=”stylesheet” type=”text/css” href=”../themes/icon.css”>

Contents （教程内容索引）

  1. 拖拽和释放 Drag and Drop
    • 基本拖拽和释放 Basic Drag and Drop   -EN- -中文-
    • 创建拖拽购物车 Building a drag-drop shopping cart -EN- -中文-
    • 创建课程表 Creating a School Timetable   -EN- -中文-

    2. Continue reading »

七 03

easyui 表单验证 Form Validation

easyUI中文教程 15 Comments »

easyUI 教程 » 表单验证 Form Validation

form.png

本教程将展示如何验证表单。easyui框架提供了一个验证插件来进行表单验证。本教程中我们将建立一个联系方式表单，并使用验证插件进行表单验证。

您可以根据自己的需要改编此表单。

创建表单

创建一个带有姓名，电子邮件，主题和信息字段的简单联系方式表单:

Continue reading »

七 03

easyui 为表单添加下拉树选择域 Add ComboTree field to a form

easyUI中文教程 5 Comments »

easyUI 教程 » 为表单添加下拉树选择域 Add ComboTree field to a form

form1.png

下拉树选择域是一个带有下拉树的选择框。它可以用来作为表单域的一部分提交到远程服务器。

本教程中我们将创建一个注册用户表单，它包括姓名，地址，城市字段。城市字段是一个下拉树选择域，我们可以通过它选择一个指定的城市。

第一步 –  创建HTML代码

Continue reading »

七 03

easyui 通过Ajax提交表单 Submit a form with Ajax

easyUI中文教程 15 Comments »

easyUI 教程 » 通过Ajax提交表单 Submit a form with Ajax

本教程将向您展示如何使用easyui提交表单。我们创建一个带有名称，电子邮件和电话号码的示例表单。通过使用easyui form插件将表单改为Ajax表单。该表单提交所有字段到后台处理程序，后台处理程序再将这些数据返回到前端页面，我们接收到这些数据并显示出来。

创建表单

<div style="width:230px;background:#E0ECFF;padding:10px;">
    <form id="ff" action="/demo5/ProcessServlet" method="post">
        <table>
            <tr>
                <td>Name:</td>
                <td><input name="name" type="text"></input></td>
            </tr>
            <tr>
                <td>Email:</td>
                <td><input name="email" type="text"></input></td>
            </tr>
            <tr>
                <td>Phone:</td>
                <td><input name="phone" type="text"></input></td>
            </tr>
            <tr>
                <td></td>
                <td><input type="submit" value="Submit"></input></td>
            </tr>
        </table>
    </form>
</div>

form1.png

将表单改为Ajax表单

Continue reading »

七 03

easyui 创建带有复选框的树节点 Create Tree with CheckBox Nodes

easyUI中文教程 No Comments »

easyUI 教程 » 创建带有复选框的树节点 Create Tree with CheckBox Nodes

使用easyui树插件可以创建带有复选框的树。如果点击节点的复选框，点击节点的信息上下继承。例如，点击’tomato’ 复选框，你将看到’Vegetables’节点部分选中。

tree.png

创建树标签

<ul id="tt"></ul>

构建带有复选框的树

Continue reading »

Previous Entries