基于easyui的仓库管理系统

使用jQuery EasyUI创建的仓库管理系统包括系统管理、数据维护、业务单据管理等,有兴趣可以对其进行修改扩展。   数据库采用MYSQL, 帐号/密码:root/root,演示登录帐号/密码:admin/admin。 数据库配置信息可以修改配置文件:/WEB-INF/classes/a...

2011-07-14 10:42:49

阅读数 641

评论数 2

在easyui中利用DataGrid的行明细区域实现CRUD操作

在easyui中,DataGrid可以通过detailview实现行的展开和收缩,利用这个特性可以实现基本的CRUD操作。     展开行时,动态加载表单并装载数据,保存或取消表单操作时再收缩行。 首先建立表格基本框架: <table id="...

2011-06-20 17:42:33

阅读数 89

评论数 0

在easyui中展开DataGrid的行,显示明细数据

easyui中的DataGrid可以切换不同的视图,当使用detailview时,可以让用户展开行以显示该行的详细信息。行的明细信息可以通过AJAX的方式进行加载。     使用detailview时,首先建立表格基本框架: <table id=&quot...

2011-06-20 17:24:45

阅读数 325

评论数 0

在EasyUI中创建分组属性编辑器

属性编辑器propertygrid支持分组显示,创建的时候可以直接在<table>中定义,不用写JS代码。如下所示: <table class="easyui-propertygrid" sty...

2011-05-05 11:53:48

阅读数 58

评论数 0

采用EasyUI制作入库单操作界面

采用EasyUI可以方便制作入库单的操作界面,先看看图: 1、入库单   往来单位采用combogrid下拉表格实现,设置mode为remote以支持可以直接在文本框中进行搜索选择供应商。 商品的操作可以通过右键菜单完成,可以添加商品、删除商品、对选中项进行上移和下移操作。   2...

2011-04-12 11:51:11

阅读数 428

评论数 0

datagrid中使用合计行

datagrid中可以使用合计行显示汇总信息,合计行可以是多行,如下图所示: 合计行的数据由datagrid的数据源提供,如下所示: {"total":1,"rows":[{"id"...

2010-12-23 16:28:11

阅读数 242

评论数 0

jquery-easyui中自定义DataGrid的视图

在DataGrid中自定义视图可以帮助我们做各种个性化的显示方式,下面以建立一个CardView的视图为例说明定义一个视图的方法,看一下效果图:   1.通过扩展$.fn.datagrid.defaults.view定义一个视图: var cardview = $.extend({}, ...

2010-10-21 14:25:09

阅读数 104

评论数 0

利用TreeGrid做简单数据报表

jquery-easyui中的TreeGrid继承DataGrid的很多特性,比如复杂表头,冻结列等,利用这些特性可以制作一般的数据报表。     创建方法基本同datagrid,所不同的是需要定义treeField属性以指定那个字段可以收缩和展开: $('#test').treegr...

2010-09-02 10:46:55

阅读数 49

评论数 0

jquery-easyui中自定义下拉框列表项格式

下拉框的列表项一般为一行文本,但实际上可以是任何HTML,所以可以轻易地定义列表项的格式,做为例子,我们来显示带图标的列表项,效果图如下: 利用formatter函数可以做到这一点,代码如下: $('#cc').combobox({ url:'combobox_data.json...

2010-08-24 15:27:51

阅读数 57

评论数 0

在datagrid的表格体中合并单元格

jquery-easyui的datagrid具有创建复杂表头和合并表格体单元格的能力,下面介绍如何合并单元格。合并后的效果图如下:     合并单元格主要通过调用mergeCells方法实现,先看创建未合并单元格时的表格代码: $('#tt').datagrid({ titl...

2010-07-08 11:22:52

阅读数 31

评论数 0

jquery-easyui中表格的行编辑功能

datagrid现在具有行编辑能力了,使用时只须在columns中为需要编辑的列添加一个editor属性,编辑保存时同时具有数据校验能力。 看一个例子效果图: 代码如下: $('#tt').datagrid({ title:'Editable DataGrid', i...

2010-06-10 17:21:26

阅读数 181

评论数 0

jquery-easyui中实现课程表拖放效果

利用jQuery EasyUI可以很容易就实现学校课程表的拖放设计,看一下效果图: 如何将左边的课程拖到右边的单元格上,利用draggable,droppable二个插件就可以做到。 看一下课程表的HTML结构: <div class="left&...

2010-05-28 09:17:53

阅读数 152

评论数 0

jquery-easyui中创建带复选框的树

easyui可以创建带复选框的树,只要带上选项checkbox:true就行了,看一下效果图: 首先建立<ul>标记 <ul id="tt"><...

2010-05-24 18:24:07

阅读数 125

评论数 0

jquery-easyui的拖放购物车范例

利用easyui的拖放能力可以轻松创建购物车,看一个例子:   1、显示产品HTML <ul class="products"> <li> ...

2010-05-24 11:58:38

阅读数 30

评论数 0

jquery-easyui中的表单验证

jQuery EasyUI中进行表单验证主要是通过validatebox插件,看一个例子: <div style="background:#fafafa;padding:10px;width:300px;height:300px;"&am...

2010-03-22 17:55:44

阅读数 28

评论数 0

jquery-easyui中添加树节点

jquery-easyui中的树具备基本的CRUD能力,添加节点主要通过append方法实现。 比如,通过以下代码建立一颗食品树:   <div style="width:200px;height:auto;border:1px solid #ccc;...

2010-03-08 12:17:08

阅读数 24

评论数 0

jquery-easyui中创建复杂的布局效果

jquery-easyui中利用panel, layout等插件可以做出很复杂的布局效果,通常不需要编写JS代码。以一个MSN的消息框为例子,看一下效果图:     设计这样的布局只需要编写HTML就行了,代码如下:   <div class=&quot...

2010-02-24 17:42:30

阅读数 43

评论数 0

基于jquery-easyui的机电设备管理系统布局新范例

使用jquery-easyui的新版本1.0.2,可以更有效地完成页面的布局设计。做页面布局时一般是不用编写JS代码的,下面重写了机电设备管理系统,仅供参考。 首先来看首页布局例子: <body class="easyui-layout&...

2010-02-05 14:53:37

阅读数 56

评论数 0

jquery-easyui中为datagrid加入分页功能

jquery-easyui中使用datagrid来加载远程数据,必须设置url属性,如下所示: <table id="tt"></table>   $('#tt')...

2010-02-01 16:44:15

阅读数 70

评论数 0

jquery-easyui中轻松转换html table

jquery-easyui中将html table转换成datagrid很简单,甚至不需要编写任何JS代码就可以完成,看一个例子: <table id="tt" class="easyui-datagrid&qu...

2010-01-31 11:02:36

阅读数 37

评论数 0

提示
确定要删除当前文章?
取消 删除