Laravel 8 AJAX实时搜索分页异常：搜索后分页返回全部数据

点击分页按钮后回到全量数据分页，核心原因是分页请求没有携带搜索关键词参数，导致控制器无法识别当前处于搜索状态，直接执行了全量数据查询。

1. 控制器：保留搜索参数并附加到分页链接 #

修改AdministrationController的查询逻辑，接收搜索参数并在分页时通过appends()携带参数：

use Illuminate\Http\Request;

public function index(Request $request)
{
    // 获取搜索关键词，默认空字符串
    $search = $request->input('search', '');

    // 带条件的查询：有搜索词时过滤，无则查全量
    $records = YourModel::when($search, function ($query) use ($search) {
        // 这里替换成你的实际搜索字段，比如name、title等
        return $query->where('name', 'like', "%{$search}%");
    })->paginate(10)
      // 把搜索参数附加到所有分页链接上
      ->appends(['search' => $search]);

    // AJAX请求返回数据列表片段，否则返回完整视图
    if ($request->ajax()) {
        return view('admin.partials.record-list', compact('records'))->render();
    }

    return view('admin.index', compact('records'));
}

2. AJAX：点击分页时携带搜索参数 #

修改jQuery代码，监听分页按钮点击事件，阻止默认跳转并手动携带当前搜索关键词：

// 封装AJAX请求函数
function loadRecords(page, search) {
    $.ajax({
        url: `/admin?page=${page}`,
        data: { search: search },
        type: 'GET',
        success: function(response) {
            // 替换数据容器内容，这里替换成你的实际容器ID
            $('#records-container').html(response);
        }
    });
}

// 实时搜索触发
$('#search-input').on('keyup', function() {
    let search = $(this).val().trim();
    // 搜索时默认回到第一页
    loadRecords(1, search);
});

// 分页按钮点击处理
$(document).on('click', '.pagination a', function(e) {
    e.preventDefault();
    // 从分页链接中提取页码
    let page = $(this).attr('href').split('page=')[1];
    // 获取当前搜索框的关键词
    let search = $('#search-input').val().trim();
    loadRecords(page, search);
});

3. 视图：确保分页链接携带参数 #

在主视图中渲染分页时，通过appends()确保参数被携带（如果控制器已经用了appends()，这一步可以简化，但显式写更稳妥）：

<!-- 数据列表容器 -->
<div id="records-container">
    @include('admin.partials.record-list')
</div>

<!-- 分页链接 -->
<div class="pagination">
    {{ $records->appends(['search' => request('search')])->links() }}
</div>

4. 路由配置 #

确保路由支持GET参数传递（默认GET路由即可，无需额外配置）：

// routes/web.php
Route::get('/admin', [AdministrationController::class, 'index'])->name('admin.index');

• 搜索触发时强制回到第一页，避免出现“搜索结果只有3条，但分页还显示第2页”的异常
• 分页链接必须携带search参数，无论是通过控制器的appends()还是手动拼接
• AJAX请求必须阻止分页按钮的默认跳转行为，否则会直接刷新页面回到全量数据

内容的提问来源于stack exchange，提问作者MERAH Samia