Home Javascript Laravel force download file with header response

Laravel force download file with header response

by Shahriar Sagor

Hello Dev’s ,Today In this article, I will teach you how to load more data with scroll by using jquery and php Laravel application. So you don’t have need to click anywhere more for load data because data is loading on page scroll automatically from MySQl database table. From here you can know how Laravel force download file with header response.

So It will check if data length is equal to 0 then it display message for “No more records!” and when data length is more than or equal 1 then it append to html data list.

Here is a short and Simple example as bellow.

Step 1 : Create Table and Model

In this step, we need to create first post table and model.



namespace App;

use Illuminate\Database\Eloquent\Model;

class Post extends Model
public $table = "post";

protected $fillable = [ 'title','description' ];   

Now we have inserted dummy records in our post table to see the loader on page scroll.

Step 2: Add Routes

Now in this step, we need to add new routes to handle request.

Step 3: Create FileController

In this step, we need to create a new controller file in following path app/Http/Controllers.



namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Controllers\HomeController;
use App\Post;

class PostController extends HomeController
    public function jqueryLoadMore(Request $request)


        foreach ($posts as $post) {
            $html.='<li>'.$post->id.' <strong>'.$post->title.'</strong> : '.$post->description.'</li>';

        if ($request->ajax()) {
            return $html;

    	return view('jqueryLoadmore');
Step 4: Create Blade File

So now in this step, we need to create a new view file within files directory so first create files in directory and then create new file as jqueryLoadmore.blade.php directory (resources/views/jqueryLoadmoreData.blade.php)


   .wrapper > ul#results li {
     margin-bottom: 2px;
     background: #e2e2e2;
     padding: 20px;
     width: 97%;
     list-style: none;
     text-align: center;
<div class="wrapper">
   <ul id="results"><!-- results appear here --></ul>
   <div class="ajax-loading"><img src="{{ asset('images/loading.gif') }}" /></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
   var page = 1; //track user scroll as page number, right now page number is 1
   load_more(page); //initial content load
   $(window).scroll(function() { //detect page scroll
      if($(window).scrollTop() + $(window).height() >= $(document).height()) { //if user scrolled from top to bottom of the page
      page++; //page number increment
      load_more(page); //load content   
    function load_more(page){
           url: '?page=' + page,
           type: "get",
           datatype: "html",
           beforeSend: function()
            if(data.length == 0){
            //notify user if nothing to load
            $('.ajax-loading').html("No more records!");
          $('.ajax-loading').hide(); //hide loading animation once data is received
          $("#results").append(data); //append data into #results element          
       .fail(function(jqXHR, ajaxOptions, thrownError)
          alert('No response from server');

Read Also : How to get last executed mysql query in laravel?

Thanks for read. I hope it help you. For more you can follow us on facebook


You may also like