tp ajax 搜索分页

本文介绍如何在TP5框架中结合Ajax实现动态的水果信息搜索和分页展示。用户可以通过输入水果名称、选择分类、状态等条件进行筛选,并查看分页结果。前端使用了jQuery进行Ajax请求,后端通过控制器处理请求并返回分页数据。
摘要由CSDN通过智能技术生成

                <center>
                <table >

                    <tr>
                        水果名称<input type="text" name="f_name" class="f_name">
                        水果分类
                        <select name="t_id" id="" class="t_id">
                            <option value="">请选择分类</option>
                            {foreach name='type' item='vo'}
                            <option value="{$vo.t_id}">{$vo.t_name}</option>
                            {/foreach}
                        </select>

                        上架状态
                        <select name="is_show"  class="is_show">
                            <option value="">请选择上架状态</option>
                            <option value="1">上架</option>
                            <option value="0">未上架</option>
                        </select>
                       活动状态
                        <select name="is_hot" class="is_hot">
                            <option value="">请选择活动状态</option>
                            <option value="1">参与活动</option>
                            <option value="0">未参与活动</option>
                        </select>
                        <input type="button" value="搜索" class="sou">
                    </tr>

                </table>
                </center>
                <table id="sample-table-1" class="table table-striped table-bordered table-hover">
                    <thead>
                    <tr>

                        <th class="center">
                            <label>
                                <input type="checkbox" class="ace" />
                                <span class="lbl"></span>
                            </label>
                        </th>
                        <th>商品编号</th>
                        <th>商品名称</th>
                        <th>商品图片</th>
                        <th>所属分类</th>
                        <th>水果重量</th>
                        <th>水果库存</th>
                        <th>已销售量</th>
                        <th>产地</th>
                        <th>销售价</th>
                        <th>会员价</th>
                        <th>是否上架</th>
                        <th>是否参与活动</th>
                        <th>操作</th>
                    </tr>
                    </thead>

                    <tbody class="body">
                    {foreach name='data' item='v'}
                    <tr>
                        <td class="center">
                            <label>
                                <input type="checkbox" class ='box' name="box" alt="{$v.f_id}"/>
                                <span class="lbl"></span>
                            </label>
                        </td>


                        <td>{$v.f_id}</td>
                        <td>{$v.f_name}</td>
                        <td><img src="<?php echo $v['f_img'];?>" alt="" width="50"></td>
                        <td>{$v.t_name}</td>
                        <td>{$v.f_weight}</td>
                        <td>{$v.f_surplus}</td>
                        <td>{$v.f_sale}</td>
                        <td>{$v.f_place}</td>
                        <td>{$v.m_price}</td>
                        <td>{$v.v_price}</td>
                        <td>
                            {if condition="$v.is_show == 1"}
                             上架
                            {else /}
                         下架
                            {/if}
                        </td>
                        <td>
                            {if condition="$v.is_hot== 1"}
                             参与活动
                            {else /}
                         不参与活动
                            {/if}
                        </td>
                        <td>
                            <a href="{:url('index/Goods/modify')}?fid={$v.f_id}">编辑</a>
                            <button class="del" alt="{$v.f_id}">删除</button>
                        </td>

                    </tr>
                    {/foreach}



                    </tbody>
                </table>
                <center>
                <table >
                <div><div class="pages">{$page}</div>
                    <input type="button" class="quan" value="全选">
                    <input type="button" class="fan" value="反选">
                    <input type="button" class="pishan" value="批删">
                    <input type="text" class="pa" value="{$num}"></div>

                </table>
                </center>
            </div><!-- /.table-responsive -->
        </div><!-- /span -->
    </div><!-- /row -->
    <script src="js/jq.js"></script>
    <script>
        var obj= new Object();
        $('.sou').click(function(){
            obj['f_name']=$('.f_name').val();
            obj['t_id']=$('.t_id').val();
            obj['is_show']=$('.is_show').val();
            obj['is_hot']=$('.is_hot').val();
//            alert(obj['t_id']);
            obj['id']=2
            page(1);
        })
        //分页

        function page(p){
            var html='';
            $.each(obj,function(k,v){
                html+=k+'='+v+'&';
            });
            var num=$('.pa').val();
            var str='';

            $.ajax({
                type: "POST",
//                url: "index.php/index/goods/page",
                url: "{:url('index/Goods/page')}",
                data: html+"p="+p+"&num="+num,
                dataType:'json',
                success: function(msg){

                    $('.pages').html(msg.page);
                    $('.pa').val(num);
                    var is_show='';
                    var is_hot='';
                    $.each( msg.list, function(k, v){
                        if(v.is_show==1){
                            is_show='上架'
                        }else {
                            is_show='下架'
                        }
                        if(v.is_hot==1){
                            is_hot='参与活动'
                        }else {
                            is_hot='不参与活动'
                        }
                        str+='<tr><td class="center"><label><input type="checkbox" class ="box" name="box" alt="'+ v.f_id+'"/><span class="lbl"></span></label></td>';
                        str+='<td>'+v.f_id+'</td><td>'+v.f_name+'</td><td><img src="'+ v.f_img+'" alt="" width="50"></td><td>'+v.t_name+'</td><td>'+v.f_weight+'</td><td>'+v.f_surplus+'</td><td>'+v.f_sale+'</td><td>'+v.f_place+'</td><td>'+v.m_price+'</td><td>'+v.v_price+'</td>';
                           str+='<td>'+is_show+'</td><td>'+is_hot+'</td><td><a href="index.php/index/Goods/modify?fid='+v.f_id+'">编辑</a><button class="del" alt="'+v.f_id+'">删除</button></td></tr>';
//                        str+='<tr><td>'+v.user_id+'</td><td>'+v.username+'</td><td>'+v.sex+'</td><td>'+v.age+'</td><td><'+v.lasttime+'</td></tr>';
                    });
                    $('.body').html(str);

        }
            });
        }


  

	public function lists()
	{
//		商品关联分类查询 普通展示
//		$data = db('sg_fruits')
//			->join('sg_type', 'sg_fruits.t_id = sg_type.t_id')
//			->select();
//		$this->view->engine->layout(true);
//		$this->assign('data', $data);
//		return view('lists');
//
//

		//分页展示
		//总条数
		$count=db('sg_fruits')
        ->join('sg_type','sg_fruits.t_id = sg_type.t_id')
			->count();
        //默认当前页1//每页显示条数
		$p=1;$num=5;
		$limit=($p-1)*$num;

		$fruits=new Fruits();
		$page=$fruits->fen($count,$p,$num);
		$data=db('sg_fruits')
			->join('sg_type','sg_fruits.t_id = sg_type.t_id')
			->limit($limit,$num)
			->select();
		//查询分类
		$type= db('sg_type')->select();

		// 把分页数据赋值给模板变量list
		$this->view->engine->layout(true);

		$this->assign('data', $data);
		$this->assign('page', $page);
		$this->assign('type', $type);
		$this->assign('num', $num);

		// 渲染模板输出
       return $this->fetch();

	}
//分页2往后
	public function  page(){
		if(isset($_POST['id'])){
			$arr=$_POST;
//			var_dump($arr);die;
			$where[]='1=1';
			if(!empty($arr['is_hot	'])){
				$a = $arr['is_hot'];
				$where[]= 'is_hot ='."$a";
			}
			if(!empty($arr['is_show'])) {
				$b = $arr['is_show'];
				$where[] = 'is_show =' . "$b";
			}
			if(!empty($arr['t_id'])) {
				$d = $arr['t_id'];
				$where[] = 'sg_fruits.t_id ='."$d";
			}
			if(!empty($arr['f_name'])) {
				$c = $arr['f_name'];
				$where[] = 'f_name	like \'%' . "$c".'%\'';
			}

			$wh=implode(' AND ',$where);
//			echo $wh;die;
			
			$num=$_POST['num'];
			$p=$_POST['p'];
			$fruits=new Fruits();
			//总条数
			$count=db('sg_fruits')
				->join('sg_type','sg_fruits.t_id = sg_type.t_id')
				->where($wh)
				->count();
			$data['page']=$fruits->fen($count,$p,$num);
			$limit=($p-1)*$num;
			$data['list']=db('sg_fruits')
				->join('sg_type','sg_fruits.t_id = sg_type.t_id')
				->where($wh)
				->limit($limit,$num)
				->select();
			echo json_encode($data);
		}else{
			$num=$_POST['num'];
			$p=$_POST['p'];
			$fruits=new Fruits();
			//总条数
			$count=db('sg_fruits')
				->join('sg_type','sg_fruits.t_id = sg_type.t_id')
				->count();
			$data['page']=$fruits->fen($count,$p,$num);
			$limit=($p-1)*$num;
			$data['list']=db('sg_fruits')
				->join('sg_type','sg_fruits.t_id = sg_type.t_id')
				->limit($limit,$num)
				->select();
			echo json_encode($data);
		}

<?php
namespace app\index\model;

use think\Model;

class Fruits{
     public function fen($count,$p,$num)
    {
        //分页数据
        $pageSum=ceil($count/$num);//总页数
        $prevPage=$p-1>1?$p-1:1;//上一页
        $nextPage=$p+1<$pageSum?$p+1:$pageSum;//下一页;
        $str='';
        $str.='<a href="javascript:page(1)">首页</a>';
        $str.='<a href="javascript:page('.$prevPage.')">上一页</a>';
        $str.=$p.'/'.$pageSum;
        $str.='<a href="javascript:page('.$nextPage.')">下一页</a>';
        $str.='<a href="javascript:page('.$pageSum.')">末页</a>';
        return $str;

    }
}



?>

</script>


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值