分页不能按预期工作 uisng laravel 和 jq

Question

我正在处理过滤数据。因为有<input>，如果有人开始打字，我正在调用jq函数向我的控制器发送请求。它工作正常。即使我也得到过滤数据。但是，如果我单击第 2 页，则会影响设计。所以当我知道它是改变我的url。

举个例子 - 过滤数据后（这工作正常）

code.test/?page=1

但是如果你点击第 2 页，它会重定向到

code.test/filter?page=2

这是我的代码main.blade-

<div class="container">

        <div class="row">

            <div class="col-md-9 col-sm-12">

                <div class="form-group">

                    <input type="text" class="form-control" id="search" placeholder="Enter email" name="email">

                </div>

            </div>

            <div class="col-md-3 col-sm-12">

                <div class="form-group">

                    <select id="department">

                        <option value="0">All Departments</option>

                        @foreach($department as $d)

                        <option value="{{$d->id}}">{{$d->name}}</option>

                        @endforeach

                    </select>

                </div>

            </div>

        </div>

        <div id="filter">

            <div class="row">

                <?php

                    $count = count($data);//dd($data[0]->fname);

                ?>

                @if($count > 0)

                    @foreach($data as $d)

                        <div class="col-md-12">

                            {{$d->fname}}, {{$d->lname}}<br>

                            {{$d->profile}}<br>

                            <b>{{$d->departments->name}}</b>

                        </div>

                    @endforeach

                @else

                    No data found

                @endif

            </div>

        </div>

        {{ $data->appends($data)->links() }}

    </div>

这是我的 jq 函数-

function filter(){

    var str = $("#search").val();

    var dep = $('#department option:selected').val();

    // /alert(dep);

    $.ajaxSetup({

        headers: {

            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')

        }

    });

   

Answer 1

回答有点晚了，但这可能对您有所帮助-在您main.blade而不是直接加载数据中，您可以将该数据传递给其他文件view，然后@include将该新blade文件传递给main.blade. 像这样 -<div class="ui-block">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="ui-block-content">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="row">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col col-xl-9 col-lg-9 col-md-9 col-sm-12 col-12">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" class="form-control" id="search" placeholder="Start typing keywords.." name="search">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col col-xl-3 col-lg-3 col-md-3 col-sm-12 col-12">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <select id="department" class="form-control">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="0">All Departments</option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; @foreach($department as $d)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="{{$d->id}}">{{$d->name}}</option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; @endforeach&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </select>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; <div id="filter">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; @include('search')&nbsp; &nbsp; &nbsp; &nbsp; </div>以创建新刀片为例search.blade，并将您拥有的任何内容粘贴<div id="filter"> /* ---- This lines ---*/到search.blade.在你js的函数中更改 url main.blade-$.ajax({&nbsp; &nbsp; &nbsp; &nbsp; type: "GET",&nbsp; &nbsp; &nbsp; &nbsp; url: '/',//change this to main.blade's url&nbsp; &nbsp; &nbsp; &nbsp; data: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; str: str,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dep: dep,&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; success: function(data){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(data);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('#filter').html(data);&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; });在 中进行更改controller。只需检查请求是否来自ajax，然后处理该数据。public function main(Request $request)&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; $data = Staff::with('departments')->orderBy('created_at', 'DESC')->paginate(10);&nbsp; &nbsp; &nbsp; &nbsp; $department = Department::all();&nbsp; &nbsp; &nbsp; &nbsp; //If request is from ajax, then processing to filter data&nbsp; &nbsp; &nbsp; &nbsp; if($request->ajax()) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $str&nbsp; &nbsp; =&nbsp; &nbsp;$request->str;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $dep&nbsp; &nbsp; =&nbsp; &nbsp;$request->dep;//dd($dep);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $s&nbsp; =&nbsp; &nbsp;new Staff;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $d&nbsp; =&nbsp; &nbsp;new Department;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if($str != null && $dep != 0){ //If input and dropdown values are available&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $data = $s::with('departments')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->where('department', $dep)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->where(function($q) use ($str) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $q->where('fname', 'like', '%'.$str.'%')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orWhere('lname', 'like', '%'.$str.'%')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orWhere('profile', 'like', '%'.$str.'%');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; })&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orderBy('created_at', 'DESC')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->paginate(10);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else if($str != null && $dep == 0){ //If input value is set and dropdown value set to all departments&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $data = $s::with('departments')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->where(function($q) use ($str) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $q->where('fname', 'like', '%'.$str.'%')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orWhere('lname', 'like', '%'.$str.'%')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orWhere('profile', 'like', '%'.$str.'%');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; })&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orderBy('created_at', 'DESC')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->paginate(10);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $data_count = count($data);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return view('search', compact('data', 'data_count'));&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else if($str == null && $dep != 0){ //If dropdown value is not null and input is null&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $data = $s::with('departments')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->where('department', $dep)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->orderBy('created_at', 'DESC')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ->paginate(10);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else if($str == null && $dep == 0){ //If dropdown value is null and input is null&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $data = $s::with('departments')->orderBy('created_at', 'DESC')->paginate(10);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // returning data to view&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return view('search', ['data' => $data])->render();&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; //returning data if request is not from ajax&nbsp; &nbsp; &nbsp; &nbsp; return view('main', compact('data', 'department'));&nbsp; &nbsp; }希望这对你有用。谢谢你。