Search Pagination without refreshing the page

You have to use JavaScript to implement this feature.

https://www.google.com/#q=site:laracasts.com+javascript+pagination+laravel

Thanks for your reply. I check the link and the result is not what I'm looking for. I use angularjs for my front-end and my form is search form. I can't post search result via json file (at least I don't know how to do this). If I can send my search result via json everything will be fine, but I don't know how to do this. I have 2 inputs in my search form and I have to send their value to the search result page.

Then you didn't look deep enough.

Unfortunate I don't know AngularJS good enough but at least with VueJS this would be easy job with its two-way variable binding.

The flow could be something like this:

1. http://example.com/search?q=foo gives you the search results view with the paginator as normal
2. You click paginator link
   • Prevent default, don't refresh the page
3. Remove old search results from the DOM
4. Make a Ajax request to your API eg. http://example.com/api/search?q=foo&page=2 for getting new search results for the new page
5. Add the results to the DOM

If you want something like infinite scrolling skip the step 3.

It's not only a page refresh, is also not returning a full list of data, only the paginated amount of rows.

@Salomoni stated you either need to Ajax the next call and refresh the part of the page or dump all the rows into your JavaScript and paginate via JavaScript

Thanks for your reply.

I finally do something else for making that work.

First I get values from inputs in index.blade.php and send it to the next page which is result.blade.php;

In the result.blade.php page I read inputs data via angularjs, search for that data via $http and show it on the page via angularjs;

After that I paginate the result with angularjs filters;

Now, I can move through pages without refresh. Even I can remove pagination and add load more at the end of the results.

Angularjs can make all of it works!!!