1. 列表组件 datagrid

1.1 创建一个grid.html

<html>

    <head>
<meta charset="utf-8" /> </head> <body> </body> </html>

1.2 引入easyUI的资源文件

<script type="text/javascript" src="jquery-easyui-1.3.3/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.3.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.3.3/themes/icon.css">
<script type="text/javascript" src="jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="jquery-easyui-1.3.3/validate.js"></script>

1.3 绘制表格组件

Html:

<table id='grid0' title="部门管理01"  class="easyui-datagrid"
fitColumn="true" pagination="true"
rownumbers="true" url="xxx.php" fit="false" toolbar="#toolbar"> </table>

效果:



1.1 编写后台程序,查询部门数据

在当前文件夹,新建一个dept.php

进行数据库连接测试

查询部门表数据,json格式返回:

1.5 分页查询

如果我们想要做分页,就需要给datagrid传递两个参数,分别为total和rows,total代表这个表的查询总数,rows代表分页后查出来的数据。

分页规律:

现在,首先考虑如何在php文件中获取第几页和每页多少条?

在datagrid组件中,只要你设置了分页,就会给后台传递page和rows,分别对应第几页和每页多少条。

代码:

//查询部门表中的数据

	$resultset = mysql_query("select * from tm_dept where 1=1 limit $start,$rows") or die(mysql_error());

	$list = array();
$count = 0; while($row = mysql_fetch_array($resultset)){ $list[$count++] = $row;
} $data = array(); $data["rows"] = $list; $resultset = mysql_query("select count(*) as total from tm_dept") or die(mysql_error()); while($row = mysql_fetch_array($resultset)){ $data["total"] = $row["total"];
} echo json_encode($data);

2. 按钮组件 linkbutton

渲染按钮的方法,给一个a标签加上class为easyui-linkbutton 即可。

例子:

<a href="javascript:openUserAddPage()" class="easyui-linkbutton" iconCls="icon-add" plain="true">新增用户</a>

3.右下角弹窗组件 $.messager

下载地址:https://pan.baidu.com/s/1OXvqQwAmz7usgD4KqiUXLw

【php增删改查实例】第五节 - easyUI的基本使用的更多相关文章

  1. 【php增删改查实例】第九节 - 部门管理模块(模糊查询)

    给datagrid添加一个工具栏. 效果: 模糊查询部门名称. 接下来,在工具栏区域画一个input框: <div id="toolbar" style="padd ...

  2. 【php增删改查实例】 第二节 - MYSQL环境配置

    安装好xampp后,会自带一个mysql,也就是说,正常情况下,你直接这样: 就可以启动mysql了. 如果你了,下面的步骤就别看了哈. if( 启动成功 ){ return; } 如果你的电脑上已经 ...

  3. 【php增删改查实例】第一节 - PHP开发环境配置

    最近需要使用PHP,于是把平时的积累整理一下,就有了这个教程. 首先是环境配置: 1.操作系统:windos7 2.后台:PHP 3.前台:Html + js + css 4.数据库:MYSQL 5. ...

  4. yii2.0增删改查实例讲解

    yii2.0增删改查实例讲解一.创建数据库文件. 创建表 CREATE TABLE `resource` ( `id` int(10) NOT NULL AUTO_INCREMENT, `textur ...

  5. python链接oracle数据库以及数据库的增删改查实例

    初次使用python链接oracle,所以想记录下我遇到的问题,便于向我这样初次尝试的朋友能够快速的配置好环境进入开发环节. 1.首先,python链接oracle数据库需要配置好环境. 我的相关环境 ...

  6. java:JSP(JSPWeb.xml的配置,动态和静态导入JSP文件,重定项和请求转发,使用JSP实现数据库的增删改查实例)

    1.JSP的配置: <%@ page language="java" import="java.util.*" pageEncoding="UT ...

  7. 【php增删改查实例】第四节 -自己 DIY 一个数据库管理工具

    本节介绍如何自己DIY一个数据库管理工具,可以在页面输入sql 进行简单的增删改查操作. 首先,找到xampp的安装目录,打开htdocs: 新建一个php文件,名称为 mysqladmin.php ...

  8. 百度鹰眼Java接口调用增删改查实例

    因感觉百度鹰眼的使用场景比较符合实际业务,于是对百度鹰眼做了简单功能调试.刚开始使用springframework封装的RestTemplate,但是测试提示ak参数不存在.后又试了几种方法,均提示a ...

  9. Maven多模块项目+MVC框架+AJAX技术+layui分页对数据库增删改查实例

    昨天刚入门Maven多模块项目,所以简单写了一个小测试,就是对数据库单表的增删改查,例子比较综合,写得哪里不妥还望大神赐教,感谢! 首先看一下项目结构: 可以看到,一个项目MavenEmployee里 ...

  10. 【php增删改查实例】第十节 - 部门管理模块(新增功能)

    正常情况下,在一个部门管理页面,不仅仅需要展示列表数据,还需要基本的增删改操作,所以,我们先把之前写好的新增功能集成进来. 在toolbar中,添加一个新增按钮. <div id="t ...

随机推荐

  1. poj_3253 Fence Repair

    Fence Repair Description Farmer John wants to repair a small length of the fence around the pasture. ...

  2. phpmyadmin 下载、安装、配置

    phpmyadmin 下载.安装.配置 phpmyadmin 下载.安装.配置 地址:https://www.phpmyadmin.net/ 点击右上角下载按钮 下载得到phpMyAdmin-4.7. ...

  3. 监控文件内容变化,即时写入到新文件(tail)

    监控文件a,如有新内容写入,即时将新内容写入到新文件aa中: fw=open('e:\\aa.txt','ab') with open('e:\\a.txt','rb') as fo: while T ...

  4. linux date 简单介绍

    用法:date [选项]... [+格式] 或:date [-u|--utc|--universal] [MMDDhhmm[[CC]YY][.ss]] 以给定的格式显示当前时间,或是设置系统日期. - ...

  5. CIDR概述及其地址块计算

    CIDR概述 英文:Classless Inter-Domain Routing,中文是:无分类域间路由选择.一般叫做无分类编址. 设计目的:解决路由表项目过多过大的问题. 表示法:{<网络前缀 ...

  6. time模块案例演示

    案例01: 2008年8月8日20:08:08 往后88,888,888秒是哪天?星期几? 日期->时间戳(浮点数)->可以做数学运算 演示: import time # 构造日期的元组, ...

  7. October 14th 2017 Week 41st Saturday

    I was well beaten myself, and I am beffer for it. 我自己也被打败过,但我因此变得更好. For most of us, the life road c ...

  8. 【Nginx】开启 gzip和缓存

    Nginx 开启 gzip和缓存 时间:2016-09-23 16:42:37 nginx 是一个高性能的 Web 服务器,之前也写过一些关于 nginx 的文章.为了提高博客的响应速度,可以从设置 ...

  9. 《面向对象程序设计》六 GUI

    git传送门 我这无药可救的拖延症和懒癌orz 主界面 文件读取界面 提示界面 最初选择vs+mfc,发现许多自动生成的代码读不懂(不须懂),尝试qt后感觉人生迎来了希望,看了推荐的视频与教程稍微了解 ...

  10. windows下安装python3 新手上路

    本文只针对刚刚拿到“驾照”的实习生 老司机回去开车.. 下载python 地址:https://www.python.org/ 选择Downloads下的windows 选择自己合适的版本  下面的是 ...