首页 > 解决方案 > 如何在多个 laravel 分页上实现 AJAX

问题描述

我在一页上有 2 个 LARAVEL 分页,我知道我想实现 AJAX 技术以便在不重新加载整个页面的情况下实现分页。使用一个分页 ajax 可以完美地工作,但是当我想在第二个 Laravel 分页上实现 AJAX 时遇到问题。有人可以帮助我吗?

第一个分页

在此处输入图像描述

第二分页 在此处输入图像描述

控制器

 function successlogin(Request $request)
    {

      $posts= Post::orderby('created_at', 'desc')->paginate(3, ['*'], 'page_1s'); 
        $documents= Document::orderby('created_at', 'desc')->paginate(2, ['*'], 'page_2s');

       if ($request->ajax()) {

            return view('presult',  compact('posts'));


        }

     return view('main_page', ['posts'=>$posts,'documents'=>$documents]);

    }

主页

 <section id="services">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 text-center">
            <h2 class="section-heading" style="color: #d21826; font-weight: bold;">Vijesti</h2>
            <hr class="my-4">
          </div>
        </div>
      </div>

      <div class="container">

                      @if(session('deletePost')) 
                  <div class="alert alert-danger" role="alert">
                     <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    {{ session('deletePost') }}  


                  </div>
                  @endif

            <div id="tag_container">

    @include('presult')
       </div>   





    </div>     
    </section>

<section class="bg-primary" id="about">
       <div class="container">
        <div class="row">
          <div class="col-lg-12 text-center">
            <h2 class="section-heading" style="color: white; font-weight: bold;">Službeni Dokumenti</h2>
            <hr class="light my-4">
          </div>
        </div>
      </div>
      <div class="container">
        <div class="row">
          <div class="col-lg-12 mx-auto text-center">
                 <div id="table_container" class="table-responsive">
                   @include('table')
                  </div>
          </div>

      </div>
  </div>
           @if (Auth::user())  
                         <a href="{{ route('document.create')}}" class="btn btn-success" style="margin-right: 3px; border-radius:0px; ">Dodaj Vijest</a>
         @endif
</section>

用于分页的 ajax_script

$(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(event)

      {

          event.preventDefault();

          $('li').removeClass('active');

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

          var myurl = $(this).attr('href');

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

          getData(page);

      });

  });



  function getData(page){

          $.ajax(

          {

              url: '?page_1s=' + page,

              type: "get",

              datatype: "html"

          })

          .done(function(data)

          {

              $("#tag_container").empty().html(data);

              location.hash = page;

          })

          .fail(function(jqXHR, ajaxOptions, thrownError)

          {

                alert('No response from server');

          });

  }

标签: phpajaxlaravel

解决方案


推荐阅读