ajax仿thinkphp官网搜索功能

后台实现代码

//搜索苍老师,如果苍老师在1不再0
function search(){
    $keyword = $_POST['search'];
    $Goods=M('goods');
  //这里我做的一个模糊查询到名字或者对应的id,主要目的因为我这个系统是
  //商城系统里面用到直接看产品ID
    $map['goods_id|goods_name']  = array('like','%'.$keyword.'%');
    // 把查询条件传入查询方法
    if($goods=$Goods->where($map)->select())
    {
    $this->ajaxReturn($goods,'查询成功!',1);
     }else{
    $this->ajaxReturn($data,"查询失败,数据不存在!",0);
     }
    }

前端代码

<script type="text/javascript">
$(document).ready(function(){
  $(".show_message").hide();
  var $search=$('#search_box');
  $("#submit_from").click(function(){
    if($("#search_box").attr("value")=='')
    {
        //alert('请输入文字!');
        $(".show_message").html('错误提示:搜索框文本不能为空!');
        $(".show_message").fadeIn(1000);
        $(".show_message").fadeOut(1000);
        $search.focus();
        //return false;
    }else{
        //开始ajax执行数据
        $.ajax({
            type: "POST",
            url:"/index.php/Goods/search",
            data:{
                search:$search.val()
            },
            dataType: "json",
            success: function (data) {
    if (data.status == 1) {
            //alert(data.info);
            var html='<table class="striped" id="senfe"><thead class="striped-top"><tr><th>商品编号</th><th class="right">商品名字</th><th class="right">添加日期</th><th class="right">商品品牌</th><th class="right">商品价格</th></tr></thead><tbody>';
            /*<th class="right">编辑</th><th class="right">删除</th>*/
                    $.each(data.data,function(no,items){    
                    html+='<tr><td>'+items.goods_id+'</td><td class="right"><a href="/Goods/show/id/'+items.goods_id+'">'+items.goods_name+'</a></td><td class="right">'+items.add_time+'</td><td class="right">'+items.brand+'</td><td class="right">'+items.price+'</td></tr>';
                    /*<td class="right"><a href="/Goods/edit/id/{$vo.goods_id}">编辑</a></td><td class="right"><a href="#">删除</a></td>*/
                    });
                    html+="</tbody></table>";    
                     $(".goods-list").html(' ').html(html);
                   // alert(html);
    }
    else if (data.status == 0) {
        $(".show_message").show();
        $(".show_message").html(data.info);
                    $(".show_message").fadeOut(3000);
    //    alert(data.info);
        return false;
    }
    }
         });
    }
  });
});
</script>

这里是页面代码


        
<div class="search_goods l mt10 mb20">
   <div class="mb5 l search">
     <h2 class="title">搜点什么呢</h2>
     <input type="text" name="search" id="search_box"/>
   </div>
   <a href="javascript:goods_search.submit();" id="submit_from" class="button orange" style="width:34px;height:12px;font-size:13px;color:#000;margin-left:30px;">搜 索</a>
</div>

















  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值