ThinkPHP与EasyUI整合之三(searchbox):在datagrid中查询指定记录
在datagrid中toolbar添加searchbox查询框,根据列范围查询数据,先看效果图:

1. searchbox采用easyui的Demo例子,再加以js扩展,根据datagrid中的列数据自动生成选择查询范围。

1 <div id="testa" style="display:inline;padding-top:17px;">
2 <!-- 这里的padding-top是让搜索栏向下点,也就是与"添加"等按钮对齐,但在HTML里面不好用,在jsp页面中已测试可用 -->
3 <input id="sss" class="easyui-searchbox" searcher="qq" prompt="请输入查询内容" style="width:200px"></input>
4 <div id="mm" style="width:100px">
5 </div>
6 </div>


1 //循环列名,生成搜索的下拉列表
2 var fields = $('#dg').datagrid('getColumnFields');
3 var muit="";
4 for(var i=0; i<fields.length; i++){
5 var opts = $('#dg').datagrid('getColumnOption', fields[i]);
6 muit += "<div name='"+ fields[i] +"'>"+ opts.title +"</div>";
7 };
8 $('#mm').html($('#mm').html()+muit);
9 $('#sss').searchbox({
10 menu:'#mm'
11 });
12 //获取生成的搜索框
13 var a=$("#testa");
14 //将生成好的搜索框放入工具栏
15 $(".datagrid-toolbar").append(a);
16 });
17 function qq(value,name){
18 $('#dg').datagrid('load', { "searchKey": name, "searchValue": value });
19 }

2. 前台需将要查询的字段和值传给datagrid。其中searchKey为字段名,searchValue为所要查询的值。
1 function qq(value,name){
2 $('#dg').datagrid('load', { "searchKey": name, "searchValue": value });
3 }
3. 后台处理:接收前台传递的参数$_POST['searchkey'],$_POST['searchValue']

1 public function read(){
2 $pagenum=isset($_POST['page']) ? intval($_POST['page']) : 1;
3 $rowsnum=isset($_POST['rows']) ? intval($_POST['rows']) : 10;
4 $User=M("User");
5 if(isset($_POST['searchValue']) and $_POST['searchValue']!=""){
6 $userlist=array();
7 $map[$_POST['searchKey']]=array('like',array('%'.$_POST['searchValue'].'%'));
8 //$userlist=$User->where($_POST['searchKey'].'="'.$_POST['searchValue'].'"')->limit(($pagenum-1)*$rowsnum.','.$rowsnum)->order('id asc')->select();
9 //$total=$User->where($_POST['searchKey'].'="'.$_POST['searchValue'].'"')->count();
10 $userlist=$User->where($map)->limit(($pagenum-1)*$rowsnum.','.$rowsnum)->order('id asc')->select();
11 $total=$User->where($map)->count();
12 if ($total==0){
13 $userlist=array("firstname"=>'',"lastname"=>'',"phone"=>'',"email"=>'',"id"=>'');
14 $json='{"total":'.$total.',"rows":['.json_encode($userlist).']}';
15 echo $json;
16 }else{
17 $json='{"total":'.$total.',"rows":'.json_encode($userlist).'}';//重要,easyui的标准数据格式,数据总数和数据内容在同一个json中
18 echo $json;
19 }
20 }else{
21 $total = $User->count(); //计算总数
22 $userlist=array();
23 $userlist=$User->limit(($pagenum-1)*$rowsnum.','.$rowsnum)->order('id asc')->select();
24 if ($total==0){
25 $userlist=array("firstname"=>'',"lastname"=>'',"phone"=>'',"email"=>'',"id"=>'');
26 $json='{"total":'.$total.',"rows":['.json_encode($userlist).']}';
27 echo $json;
28 }else{
29 $json='{"total":'.$total.',"rows":'.json_encode($userlist).'}';//重要,easyui的标准数据格式,数据总数和数据内容在同一个json中
30 echo $json;
31 }
32 }
33 }

4.分析后台代码
1. 首先判断是否要生成查询数据,条件是传递参数$_POST['searchKey']存在且不为空 。
if(isset($_POST['searchValue']) and $_POST['searchValue']!="")
2. 采用like查询语言扩大查询范围,$map[$_POST['searchKey']]=array('like',array('%'.$_POST['searchValue'].'%'));生成的查询代码是:$_POST['searchKey']
like % $_POST['searchValue'] %
3. 生成的查询记录要符合datagrid的json数据格式。其中json数据的总记录用count()生成,需位于where条件之后。
http://www.cnblogs.com/m199/archive/2012/12/20/2825720.html
ThinkPHP与EasyUI整合之三(searchbox):在datagrid中查询指定记录的更多相关文章
- ThinkPHP与EasyUI整合之二(datagrid):删除多条记录
学习EasyUI已有一段时间了,现在开始逐步把平时学习的细节和难点记录下来. 1. datagrid选中多条记录的语句是: var rows = $('#dg').datagrid('getSelec ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇(七)图片上传功能
日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合>讲了富文本编辑器UEditor的整合与使用 ...
- easyui datagrid中 多表头方法总结
easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...
- 如何用easyui+JAVA 实现动态拼凑datagrid表格(续)
前面一段时间写了一篇文章: 如何用easyui+JAVA 实现动态拼凑datagrid表格 这篇文章的话,效果是可以实现,但是经过我反复试验,还是存在一些问题的. 今天这篇文章就是向大家介绍下如何避免 ...
- easyui datagrid中datetime字段的显示和增删改查问题
datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...
- EasyUI 1.3之前DataGrid中动态选中、获取Checkbox
这几天做项目,由于项目中用到的EasyUI版本过低,不能使用自带操作DataGrid中CheckBox的方法. 所以自己写了一个临时方案: 根据ID集合选中所属行的CheckBox: data={1, ...
- EasyUi DataGrid中数据编辑方式及编辑后数据获取,校验处理
EasyUi中的DataGrid提供前台编辑的相关函数. 实现客户选中DataGrid中一列后,对选中列中的一个字段进行编辑,并对数据进行实时校验后,传递至后台保存的需求, 主要涉及到DataGrid ...
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(六)maven整合SSM
写在前面的话 承接前文<Spring+SpringMVC+MyBatis+easyUI整合基础篇(五)讲一下maven>,本篇所讲述的是如何使用maven与原ssm项目整合,使得一个普 ...
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(八)mysql中文查询bug修复
写在前面的话 在测试搜索时出现的问题,mysql通过中文查询条件搜索不出数据,但是英文和数字可以搜索到记录,中文无返回记录.本文就是写一下发现问题的过程及解决方法.此bug在第一个项目中点这里还存在, ...
随机推荐
- 消息队列系列(四):Rabbitmq常用命令行
目录:安装目录下的 ./sbin rabbitmqctl [-n node] [-t timeout] [-q] {command} [command options…] http://www.rab ...
- mac 下安装 mysql (蛋疼)
mac先安装mydql步骤 1.首先从官网上下载 mac版本的mysql:我的是mysql-5.7.20-macos10.12-x86_64.dmg 2.正常安装: 3.在系统偏好设置的最底下.1:是 ...
- C#断点续传
我们经常使用下载工具,如bit精灵.迅雷.FlashGet,这些软件都支持断点续传. 断点续传即下载任务暂停后可以继续,而无需重新下载,即下载时需要通知服务器的起始位置.如果允许多线程进行分片下载,必 ...
- Shell--命令执行的判断依据:;,&&,||
:在命令与命令中间利用分号来隔开,这样一来,分号前得命令执行完后就会立刻接着执行后面的命令了 &&若第一个命令执行完毕并且正确执行也就是$?=0,则开始执行后一个命令,否则不执行 || ...
- 判断浏览器是否支持 JS
在有些浏览器中不支持(或者被禁用了)脚本语言,那么javascript脚本则无法被执行.但是用户并不知道浏览器是否支持,或者被禁用.我们可以通过<noscript>标签来告知用户,JS脚运 ...
- Git服务器分类
目录(?)[-] 服务器上的 Git 协议 本地协议 优点 缺点 SSH 协议 优点 缺点 Git 协议 优点 缺点 HTTPS 协议 优点 缺点 在服务器部署 Git 将纯目录转移到服务器 小型安装 ...
- Excel 对应.xml/.ftl 配置(中爆导出范文)
<?xml version="1.0"?><Workbook xmlns="urn:schemas-microsoft-com:office:sprea ...
- servlet--百度百科
Servlet(Server Applet),全称Java Servlet, 未有中文译文.是用Java编写的服务器端程序.其主要功能在于交互式地浏览和修改数据,生成动态Web内容.狭义的Servle ...
- 用JDOM读取XML文件
用JDOM读取XML文件需先用org.jdom.input.SAXBuilder对象的build()方法创建Document对象,然后用Document类.Element类等的方法读取所需的内容.IB ...
- python基础 实战作业 ---Excel基本读写与数据处理
代码地址如下:http://www.demodashi.com/demo/11650.html 看完本篇需要: 10min 作业练习需要: 0.5h~3h(依练习者对python熟悉程度而定) 看完本 ...