pre{white-space:pre-wrap;}jQueryEasyUI数据网格-扩展编辑器一些常见的编辑器（editor）添加到数据网格（datagrid），以便用户编辑数据。所有的编辑器（editor）都定义在$.fn.datagrid.defaults.editors对象中，这个可以继承扩展以便支持新的编辑器...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-启用行内编辑可编辑的功能是最近添加到数据网格（datagrid）的。它可以使用户添加一个新行到数据网格（datagrid）。用户也可以更新一个或多个行。本教程向您展示如何创建一个数据网格（datagrid）和内联编辑器。创建数据网格（...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-自定义分页数据网格（datagrid）内置一个很好特性的分页功能，自定义也相当简单。在本教程中，我们将创建一个数据网格（datagrid），并在分页工具栏上添加一些自定义按钮。创建数据网格（DataGrid）<tableid="tt"...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-添加复选框本实例演示如何放置一个复选框列到数据网格（DataGrid）。通过复选框，用户将可以选择选中/取消选中网格行数据。为了添加一个复选框列，我们仅仅需要添加一个列的checkbox属性，并设置它为true。代码如下所示：<tab...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-创建列组合easyui的数据网格（DataGrid）可以创建列组合，如下所示：在本实例中，我们使用平面数据来填充数据网格（DataGrid）的数据，并把listprice、unitcost、addr1、status列组合在一个单一的列...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-自定义排序如果默认的排序行为不满足您的需求，您可以自定义数据网格（datagrid）的排序行为。最基础的，用户可以在列上定义一个排序函数，函数名是sorter。这个函数将接受两个值，返回值将如下：valueA>valueB=>返回1v...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-设置排序本实例演示如何通过点击列表头来排序数据网格（DataGrid）。数据网格（DataGrid）的所有列可以通过点击列表头来排序。您可以定义哪列可以排序。默认的，列是不能排序的，除非您设置sortable属性为true。创建数据网...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-格式化列以下实例格式化在easyuiDataGrid里的列数据，并使用自定义列的formatter，如果价格小于20就将文本变为红色。为了格式化一个数据网格（DataGrid）列，我们需要设置formatter属性，它是一个函数。这个...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-动态改变列数据网格（DataGrid）列可以使用'columns'属性简单地定义。如果您想动态地改变列，那根本没有问题。为了改变列，您可以重新调用datagrid方法，并传递一个新的columns属性。创建数据网格（DataGrid）...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-设置冻结列本实例演示如何冻结一些列，当用户在网格上移动水平滚动条时，冻结列不能滚动到视图的外部。为了冻结列，您需要定义frozenColumns属性。frozenColumn属性和columns属性一样。$('#tt').datagr...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-创建复杂工具栏数据网格（datagrid）的工具栏（toolbar）可以包含按钮及其他组件。您可以通个一个已存在的DIV标签来简单地定义工具栏布局，该DIV标签将成为数据网格（datagrid）工具栏的内容。本教程将向您展示如何创建数...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-添加工具栏本实例演示如何添加工具栏（toolbar）到数据网格（datagrid）。创建数据网格（DataGrid）<tableid="tt"class="easyui-datagrid"style="width:600px;heig...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-添加查询功能本实例演示如何从数据库得到数据，并将它们显示在数据网格（datagrid）中。然后演示如何根据用户输入的搜索关键词搜寻显示结果。创建数据网格（DataGrid）创建带有分页功能的数据网格（datagrid），然后添加工具栏...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-取得选中行数据本实例演示如何取得选中行数据。数据网格（datagrid）组件包含两种方法来检索选中行数据：getSelected：取得第一个选中行数据，如果没有选中行，则返回null，否则返回记录。getSelections：取得所有...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI数据网格-转换HTML表格为数据网格本实例演示如何转换表格（table）为数据网格（datagrid）。数据网格（datagrid）的列信息是定义在<thead>标记中，数据是定义在<tbody>标记中。确保为所有的数据列设置field名称，请...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-创建XP风格左侧面板通常情况下，在WindowsXP的资源管理器文件夹中，左侧的面板（panel）包含一些常见任务。本教程向您展示如何通过easyui的面板（panel）插件来创建XP左侧面板。定义一些面板（panel）我们定义一些面板（...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-添加自动播放标签页（Tabs）本教程将向您展示如何创建一个自动播放的Tabs。Tabs组件显示第一个tab面板，然后显示第二个、第三个...我们将写一些代码来自动地切换tab面板，然后让它循环。步骤1：创建Tabs<divid="tt"c...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-动态添加标签页（Tabs）通过使用jQueryEasyUI可以很容易地添加Tabs。您只需要调用'add'方法即可。在本教程中，我们将使用iframe动态地添加显示在一个页面上的Tabs。当点击添加按钮，一个新的tab将被添加。如果tab...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-创建标签页（Tabs）本教程将向您演示如何使用easyui创建一个Tabs组件。Tabs有多个可以动态地添加或移除的面板（panel）。您可以使用Tabs来在相同的页面上显示不同的实体。Tabs一次仅仅显示一个面板（panel），每个面板...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-创建折叠面板在本教程中，您将会学习到关于easyui折叠面板（Accordion）的知识。折叠面板（Accordion）包含一系列的面板（panel）。所有面板（panel）的头部（header）都是可见的，但是一次仅仅显示一个面板（pa...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-在面板中创建复杂布局面板（Panel）允许您创建用于多种用途的自定义布局。在本实例中，我们使用面板（panel）和布局（layout）插件来创建一个msn消息框。我们在区域面板中使用多个布局（layout）。在消息框的顶部我们放置一个查询...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI布局-为网页创建边框布局边框布局（borderlayout）提供五个区域：east、west、north、south、center。以下是一些通常用法：north区域可以用来显示网站的标语。south区域可以用来显示版权以及一些说明。west区...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI菜单与按钮-创建分割按钮（SplitButton）分割按钮（SplitButton）包含一个链接按钮（LinkButton）和一个菜单（Menu）。当用户点击或者鼠标悬停在向下箭头区域，将会显示一个对应的菜单。本实例演示了如何创建和使用分割按钮...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI菜单与按钮-创建菜单按钮（MenuButton）菜单按钮（MenuButton）包含一个按钮（button）和一个菜单（menu）组件，当点击或移动鼠标到按钮上，将显示一个对应的菜单。为了定义一个菜单按钮（MenuButton），您应该定义一个...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI菜单与按钮-创建链接按钮（LinkButton）通常情况下，使用<button>元素来创建按钮，而链接按钮（LinkButton）则是使用<a>元素来创建的。所以实际上一个链接按钮（LinkButton）就是一个显示为按钮样式的<a>元素。为了...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI菜单与按钮-创建简单的菜单菜单（Menu）定义在一些DIV标记中，如下所示：<divid="mm"class="easyui-menu"style="width:120px;"><divonclick="javascript:alert('ne...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI拖放-创建学校课程表本教程将向您展示如何使用jQueryEasyUI创建一个学校课程表。我们将创建两个表格：在左侧显示学校科目，在右侧显示时间表。您可以拖动学校科目并放置到时间表单元格上。学校科目是一个<divclass="item">元素，时...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI拖放-创建拖放的购物车如果您能够通过您的Web应用简单地实现拖动和放置，您就会知道一些特别的东西。通过jQueryEasyUI，我们在Web应用中可以简单地实现拖放功能。在本教程中，我们将向您展示如何创建一个启用用户拖动和放置用户想买的商品的购...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI拖放-基本的拖动和放置本教程向您展示如何使HTML元素可拖动，在本例中，我们将创建三个DIV元素然后启用他们的拖动和放置。首先，我们创建三个<div>元素：<divid="dd1"class="dd-demo"></div><divid="dd...

[阅读全文]

pre{white-space:pre-wrap;}jQueryEasyUI应用-创建RSSFeed阅读器在本教程中，我们将通过jQueryEasyUI框架创建一个RSS阅读器。我们将使用以下插件:layout：创建应用的用户界面。datagrid：显示RSSFeed列表。tree：显示feed频道。步骤1：创建布局（...

[阅读全文]