ajax 多条件模糊查询分页

最新推荐文章于 2023-06-18 15:03:06 发布

足迹365

最新推荐文章于 2023-06-18 15:03:06 发布

阅读量1.4k

点赞数

分类专栏： JQuery的了解及应用文章标签： ajax 分页

本文链接：https://blog.youkuaiyun.com/zuji366/article/details/77388386

版权

JQuery的了解及应用专栏收录该内容

5 篇文章

订阅专栏

本文介绍如何利用Ajax技术实现网页上的多条件模糊查询，并结合分页功能，提供用户友好的数据浏览体验。重点讲解了分页样式的编写和Ajax代码的实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实现分页方法：
代码如下：

public  function  index(){
    $page=Input::get('page')?Input::get('page'):1;
    $name=Input::get('name')?Input::get('name'):null;
    //每页显示条数
    $num=2;
    //偏移量
    $offset=($page-1)*$num;
    $paging=$this->get_page();
    if(Request::ajax())
    {
        $where="is_audit=0";
        if(!empty($name))
        {
            $where=$where." and club_name like '%$name%'  or club_intro like '%$name%' ";
        }
        $data=DB::table('sport_club')->whereRaw($where)->offset($offset)->limit($num)->get();
        $info=array('data'=>$data,'paging'=>$paging);
        echo json_encode($info);               
    }
    else
    {
        $where="is_audit=0";
        if(!empty($name))
        {
            $where=$where." and club_name like '%$name%' or club_intro like '%$name%'";
                            }
        $data=DB::table('sport_club')->whereRaw($where)->offset($offset)->limit($num)->get();
        $info=array('data'=>$data,'paging'=>$paging);

                            return  view('Xiangmu.add',['info'=>$info]);
    }
}

分页样式编写

public function get_page(){
    $name=Input::get('name')?Input::get('name'):null;
    //当前页
    $page=Input::get('page')?Input::get('page'):1;
    // return $page;
    $page_str="<a href='javascript:;' p='1' class='changep'>首页</a>";
    //每页显示条数
    $num=2;
    //偏移量
    $offset=($page-1)*$num;
    $where="is_audit=0";
    if(!empty($name)){
        $where=$where." and club_name like '%$name%' or club_intro like '%$name%'";
    }
    //总条数
    $count=DB::table('sport_club')->whereRaw($where)->count();
    //总页数
    $end=ceil($count/$num);
    $end_str="<a href='javascript:;' p=".$end." class='changep'>尾页</a>";
    // return $end;
    //上一页
    $before=($page-1)<1?1:($page-1);
    $before_str="<a href='javascript:;' p=".$before." class='changep'>上一页</a>";
    //下一页
    $next=($page+1)>$end?$end:($page+1);
    // print_r($next);die;
    $next_str="<a href='javascript:;' p=".$next." class='changep'>下一页</a>";
    return $page_str.$before_str.$next_str.$end_str;
}

ajax 代码编写

<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script>
//分页
$(document).on('click','.changep',function(){
    var page=$(this).attr('p');
    var name=$('#name').val();
    // alert(page);
    send_ajax(page,name)
})

//搜索
$('#btn').click(function(){
    var name=$('#name').val();
    send_ajax(1,name)
})

//发送ajax
function send_ajax(page,name)
{
    $.ajax({
       type: "GET",
       url: "index",
       data: "page="+page+"&name="+name,
       dataType: "json",
       success: function(msg){
            var str="";
            $.each(msg.data,function(k,v){
                if(v.is_hot==1){
                    var hot='是';
                }else{
                    var hot='否';
                }
                if(v.status==1){
                    var status='是';
                }else{
                    var status='否';
                }
                if(v.is_audit==1){
                    var is_audit="<button style='color:green;'>审核已通过</button>";
                }else{
                    var is_audit="<button style='color:red;'>正在处理中</br>. </br>.   </br>  . </button>";
                }
                str += '<tr>';
                str += '<td>'+v.club_id +'</td>';
                str += '<td>'+v.club_name+'</td>';
                str += '<td width="10%"><img src="http://47.94.22.241/'+v.club_img+'"  alt="" width="70"height="50" /></td> ';
                str += '<td>'+v.club_intro+' </td>';
                str += '<td>'+v.club_price+'</td>';
                str += '<td>'+v.club_address+'</td>';
                str += '<td>'+hot+'</td>';
                str += '<td>'+status+'</td>';
                str += '<td>';
                str += '<a href="update?is_audit='+v.is_audit+'&id='+v.club_id+'"  style="color:red;">'+is_audit+'</a>';
               str += ' </td>';
                str += '<td>';
                str += '<a href="delete?id='+v.club_id+'"><button>删除</button> </a>';
                str += '</td>';
                str += '</tr>';
            });
            $('#box').html(str);
            $('.pages').html(msg.paging);
       }
    });
}
</script>