Question

我正在加载具有分页的页面加载数据，并且它可以正常工作，然后我必须在同一页面上进行搜索，我搜索的值会正确显示结果，并且分页链接也正确，当我单击下一步时要查看搜索结果的第二条记录，分页链接会增加，看起来正在重新搜索，并带来所有结果，而不仅仅是我下次单击时想要的结果。

请查看屏幕截图
1. https://prnt.sc/nduf3b
2. https://prnt.sc/nduitr 3. https://prnt.sc/ndujri

控制器功能

public function sharesShow(Request $request)
{
$data = array();
$data = Share::paginate(1);
$all = '';

if ($request->ajax()) {
    $all = $request->all();
    if(isset($all['data'])){
        parse_str($all['data'], $getData);
        $categoryId = $getData['categoryId'];
        $shareName = $getData['shareName'];
        $data = Share::where('categoryId', $categoryId)->paginate(1);
    }
    return view('shares.showAjax')->with('data',$data);
  }
    return view('shares.show')->with('data',$data);
}

JS

<script type="text/javascript">

  $(window).on('hashchange', function() {
    if (window.location.hash) {
       var page = window.location.hash.replace('#', '');
      if (page == Number.NaN || page <= 0) {
        return false;
      }else{
        getData(page);
      }
     }
  });

$(document).ready(function()
{
   $(document).on('click', '.pagination a',function(e)
   {

    e.preventDefault();

        $('li').removeClass('active');
        $(this).parent('li').addClass('active');

        var myurl = $(this).attr('href');
        var page=$(this).attr('href').split('page=')[1];

        console.log(page);
        // return false;

        getData(page);

    });

// });

function getData(page){

    $.ajax({
        url: '?page=' + page,
        type: "get",
        datatype: "html",
        success: function(data){
          $("#tag_container").empty().html(data);
          location.hash = page;
        }
    });
   }

 });

    $(document).ready(function(){

        $('#searchBtn').click(function(e){
           e.preventDefault();

           var url = $("#searchForm").attr('action');
           var data = $("#searchForm").serialize();

           $.ajax({
              url: url,
              method: 'get',
              data: {
                "data": data,
                "_token": "{{ csrf_token() }}"
              },
              dataType: "html",

              success: function(result){
                $("#tag_container").html("");
                console.log(result);                    
                $("#tag_container").html(result);
                }
            });
           });

        });
    </script>

laravel分页在搜索中无法正常工作

0 个答案: