JQueryEasyUi学习笔记

参考文章
http://www.jeasyui.net/tutorial/147.html http://www.jeasyui.net/demo/483.html http://blog.csdn.net/fansy1990/article/details/46943657
EasyUI 创建 CRUD 应用

datagrid：向用户展示列表数据。

dialog：创建或编辑一条单一的用户信息。

form：用于提交表单数据。

messager：显示一些操作信息。

创建一个 CRUD 数据网格（DataGrid）

当切换数据网格视图（datagrid view）到 'detailview'，用户可以展开一行来显示一些行的明细在行下面

创建一个 RSS 阅读器。

EasyUI 基本的拖动

<div id="dd1" class="dd-demo"></div>

$('#dd1').draggable();

创建链接按钮（Link Button），所有您需要做的就是添加一个名为 'easyui-linkbutton' 的 class 属性到<a> 元素

有时候您需要禁用链接按钮（Link Button）或者启用它，下面的代码演示了如何禁用一个链接按钮（Link Button）：

$(selector).linkbutton('disable'); // call the 'disable' method

菜单按钮（Menu Button）包含一个按钮（button）和一个菜单（menu）组件，当点击或移动鼠标到按钮上，将显示一个对应的菜单。

折叠面板（Accordion）包含一系列的面板（panel）。 所有面板（panel）的头部（header）都是可见的，但是一次仅仅显示一个面板（panel）的 body 内容。

当用户点击面板（panel）的头部（header）时，该面板（panel）的 body 内容将可见，同时其他面板（panel）的 body 内容将隐藏不可见

分页组件（pagination）

并设置 'pagination' 属性为 true，它将在数据网格（datagrid）的底部生成一个分页（pagination）工具栏。

pagination将发送两个参数到服务器：

page：页码，起始值 1。

rows：每页显示行。

返回total总个数

getSelected：取得第一个选中行数据，如果没有选中行，则返回 null，否则返回记录。

getSelections：取得所有选中行数据，返回元素记录的数组数据。

通过 'toolbar' 属性附加工具栏（toolbar）到数据网格（datagrid）

为了格式化一个数据网格（DataGrid）列，我们需要设置 formatter 属性，它是一个函数。这个格式化函数包含三个参数：

value：当前列对应字段值。

row：当前的行记录数据。

index：当前的行下标。

点击列表头来排序数据网格（DataGrid）

设置 sortable 属性为 true。

当排序时，数据网格（DataGrid）将发送两个参数到远程服务器：

sort：排序列字段名。

order：排序方式，可以是 'asc' 或者 'desc'，默认值是 'asc'

复选框列

添加一个列的 checkbox 属性，并设置它为 true

创建卡片视图（Card View）

显示页脚行，您应该设置 showFooter 属性为 true，然后准备定义在数据网格（datagrid）数据中的页脚行

数据网格（datagrid）的 rowStyler 函数的设计目的是允许您自定义行样式

创建一个窗口（window）非常简单

记得设置 'closed' 属性为 'true' 值，您可以调用 'open' 方法来打开窗口（window）

easyui-validatebox 到 input 标记，所以 input 标记将根据 validType 属性应用验证