效果
说明
基于thinkPHP3.2.3版本的框架实现，利用ajax从后台数据库中获取数据，其中获取数据是用模糊搜索方式，返回json数据，然后在模板中利用js将数据显示到搜索框下拉面板中。
模板
- <script> var myloader = function(param,success,error){ var q = param.q || ''; if (q.length <= 0) { console.log("q.length <= 0"); return false; } else { console.log("q.length > 0"); } $.ajax({ url: '__CONTROLLER__/search/',type: 'POST',dataType: 'json',data: {'searchValue': q},success: function(data){ var items = $.each(JSON.parse(data),function(value){ return value; }); success(items); } }); } </script>
- <body>
- <div>
- <input class="easyui-comboBox" data-options=" valueField:'code',textField:'spec',loader : myloader,mode : 'remote'"/>
- </div>
- </body>
控制器
- <?PHP
- //---------------------------------------------------
- //功 能：动态模糊搜索测试
- //创建日期：2015-10-27
- //修改日期：2015-10-27
- //创 建 人：yicm
- //修 改 人：yicm
- //修改内容：
- //---------------------------------------------------
- namespace Home\Controller;
- use Think\Controller;
- class SearchController extends Controller {
- public function index(){
- $this->assign('title','动态模糊搜索测试');
- $this->display();
- }
-
- public function helloSearch(){
- echo 'hello search!';
- }
-
- public function search(){
- $keyword = $_POST['searchValue'];
- //$keyword = 'A4';
- $Goods=M('t_goods');
- //这里我做的一个模糊查询到名字或者对应的id,主要目的因为我这个系统是
- //商城系统里面用到直接看产品ID
- $map['code|name|spec|model'] = array('like','%'.$keyword.'%');
- // 把查询条件传入查询方法
- if($goods = $Goods->where($map)->select()){
- $returnData = json_encode($goods);
- $this->ajaxReturn($returnData);
- }else{
- $goods['content'] = 'Failed';
- $returnData = json_encode($goods);
- $this->ajaxReturn($goods);
- }
- }
- //获取商品记录数
- function getCount(){
- $credit = M('t_goods');
- $count = $credit->count(); //计算记录数
- echo $count;
- }
- }
- ?>
功能实现中注意点
- Uncaught TypeError: Cannot use ‘in’ operator to search for ” in JSON string
- $.each(JSON.parse(data)或$.each($.parseJSON(data)来解决
- 大多数web应用程序将直接返回JSON格式化的字符串,你需要把它转换成JavaScript对象能够解析的格式。
- 这里用的是essyui-comboBox的loader方法触发ajax的异步请求，然后将获取后台数据写到下拉框中，注意的是写入的是t_goods表的spec字段的值。
- [{"id":"1","category_id":"101","code":"1001","name":"\u6cf0\u683c\u98ce\u8303","spec":"A4","model":"70\u514b","unit_id":"\u5f20","sale_price":"0.20","purchase_price":"0.09","py":"tgff","bar_code":null},{"id":"2","code":"1002","model":"80\u514b","purchase_price":"0.10","py":null,{"id":"3","code":"1003","spec":"A3","sale_price":"0.30","purchase_price":"0.15",{"id":"4","code":"1004","sale_price":"0.40","purchase_price":"0.20",{"id":"5","category_id":"102","code":"1005","name":"DoubleA",{"id":"6","code":"1006",{"id":"7","code":"1007","bar_code":null}]
