Advertisement
Guest User

Untitled

a guest
Sep 27th, 2018
85
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. JQUERY HANDLING THE LOAD MORE //USING DATA-ID ('POST->ID')
  2. <script>
  3. $(document).ready(function(){
  4.    $(document).on('click','#btn-more',function(){
  5.  
  6.       // use data-page ==> next page's number i.e. load next page
  7.       var page = $(this).data('page');
  8.      
  9.       $("#btn-more").html("Loading....");
  10.        $.ajax({
  11.            url : '{{ url("loadpost") }}',
  12.            method : "GET",
  13.            data : {_token:"{{csrf_token()}}", page: page },
  14.            dataType : "text",
  15.            success : function (data)
  16.            {
  17.               if(data != '')
  18.               {
  19.                   $('#remove-row').remove();
  20.                   $('#load-data').append(data);
  21.               }
  22.               else
  23.               {
  24.                   $('#btn-more').html("No More Post");
  25.               }
  26.            }
  27.        });
  28.    });  
  29.    </script>
  30.  
  31.  
  32. THE LOAD MORE BUTTON ITSELF
  33.                             <div class="about_memeber" id="remove-row" data-aos="fade-up" data-aos-duration="1500">
  34.                                 <!-- you must be able to reference the $_GET['page'] == $request->page == $page -->
  35.                                 <!-- $page++ ==> next page -->
  36.                                 <button class="btn btn--secondary" id="btn-more" data-page="{{ $page++ }}"> Load more </button>
  37.                             </div>
  38.  
  39.  
  40. THE VIEW FOR BLOG
  41.                         <div class="clipcard posts" id="load-data" data-aos="fade-up" data-aos-duration="1500">
  42.                                @foreach($posts as $post)
  43.                                 <div class="clipcard__body">
  44.                                     <a href="{{route('blog', $post->slug)}}" class="hover-_effeft">
  45.                                         <div class="row margin-bottom margin-top">
  46.                                             <div class="col-12 col-md-4">
  47.                                                 <div class="blog_img_container">
  48.                                                     <div class="blog-image" style="background-image:url('/images/{{$post->image}}');">                   
  49.                                                     </div>
  50.                                                 <div class="author">
  51.                                                 <span>Written by {{$post->user->name}}</span><span> {{ date('F d, Y',  strtotime($post->publish)) }}</span>
  52.                                                 </div>
  53.  
  54.                                             </div>
  55.                                             <div class="col-12 col-md-4">
  56.                                                 <div class="blog-title">
  57.                                                     <h2>{{$post->title}}</h2>
  58.                                                 </div>
  59.                                             </div>
  60.                                             <div class="col-12 col-md-4">
  61.                                                 <div class="blog-content">
  62.                                                     <p>
  63.                                                         {!!$post->excerpt!!}
  64.                                                     </p>
  65.                                                 </div>
  66.                                             </div>
  67.                                         </div>
  68.                                     </a>
  69.                                 </div>
  70.                               @endforeach
  71.                             </div>
  72.  
  73.  
  74. THE PUBLIC FUNCTION IN MY CONTROLLER
  75.  
  76. public function loadPost(Request $request)
  77.     {
  78.         $output = '';
  79.         $id = $request->id;
  80.        
  81.        
  82.         $posts = post::where('status',1)->orderBy('publish','DESC')->skip($request->page * 8)->take(8)->get();
  83.        
  84.         if(!$posts->isEmpty())
  85.         {
  86.             foreach($posts as $post)
  87.             {
  88.                 $url = url('/images/'.$post->image);
  89.                 $body = str_limit(strip_tags($post->body), 350);
  90.                
  91.                 $output .= '<div class="clipcard__body">
  92.                <a href="'.route('blog', $post->slug).'" class="hover-_effeft">
  93.                <div class="row margin-bottom margin-top">
  94.                <div class="col-12 col-md-4">
  95.                <div class="blog_img_container">
  96.                <div class="blog-image" style="background-image:url('.$url.');"></div>
  97.                </div>
  98.                <div class="author">
  99.                <span>Written by '.$post->user->name.'</span><span> '.date('F d, Y',  strtotime($post->publish)).'</span>
  100.                </div>
  101.                </div>
  102.                <div class="col-12 col-md-4">
  103.                <div class="blog-title">
  104.                <h2>'.$post->title.'</h2>
  105.                </div>
  106.                </div>
  107.                <div class="col-12 col-md-4">
  108.                <div class="blog-content">
  109.                <p>
  110.                '.$body.'
  111.                </p>
  112.                </div>
  113.                </div>
  114.                </div>
  115.                </a>
  116.                </div>';
  117.             }  
  118.            
  119.             $output .= '
  120.            <div class="about_memeber" id="remove-row" data-aos="fade-up" data-aos-duration="1500">
  121.            <button class="btn btn--secondary" id="btn-more" data-page=" '. $page++ .'"> Load more </button>
  122.            </div>';
  123.             echo $output;          
  124.         }
  125.  
  126. THIS IS MY ROUTE FOR AJAX POST
  127. Route::post('loadpost','UserController@loadPost' );
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement