Today, We want to share with you Simple Jquery Ajax Pagination with Laravel 5.7 Example.In this post we will show you Laravel 5.7 Jquery Ajax Pagination Example From Scratch, hear for Laravel 5.7 Ajax Pagination Example we will give you demo and example for implement.In this post, we will learn about laravel 5.7 ajax pagination with jquery with an example.
Simple Jquery Ajax Pagination with Laravel 5.7 Example
There are the Following The simple About Simple Jquery Ajax Pagination with Laravel 5.7 Example Full Information With Example and source code.
As I will cover this Post with live Working example to develop PHP Laravel 5.7 JQuery Ajax Pagination Tutorial, so the some major Laravel 5.7 AJAX Pagination with JQuery Example for this example is following below.
- Laravel 5.7 setup
- Create a Migration Laravel 5.7
- Laravel 5.7 create Route
- Create Controller
Laravel 5.7 ajax pagination with jquery Example
Step 1 : Simple Way To Install Laravel 5.7
composer create-project --prefer-dist laravel/laravel atmiya25
Step 2: Make Laravel 5.7 Table and Model
Laravel 5.7 php artisan command >> create migration for members table
php artisan make:migration create_members_table
“database/migrations”
<?php
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
class CreateMembersTable extends Migration
{
public function up()
{
Schema::create('members', function (Blueprint $table) {
$table->increments('id');
$table->string('membername');
$table->timestamps();
});
}
public function down()
{
Schema::dropIfExists('members');
}
}
Run this commands and create Mysql Database
php artisan migrate
app/Member.php
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Member extends Model
{
}
Step 3: Make Laravel 5.7 Route
routes/web.php
Route::get('simple-pagination','[email protected]')->name('ajax.pagination');
Step 4: Make Laravel 5.7 Controller
app/Http/Controllers/MemberController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Member;
class MemberController extends Controller
{
/**
* Display a listing of the resource.
* laravel 5.7 pagination ajax
* @return \Illuminate\Http\Response
*/
public function simplePagination(Request $request)
{
$data = Member::paginate(5);
if ($request->ajax()) {
return view('members', compact('data'));
}
return view('simplePagination',compact('data'));
}
}
Step 5: Make Laravel 5.7 Blade Files
resources/views/simplePagination.blade.php
<!DOCTYPE html>
<html>
<head>
<title>laravel 5.7 pagination ajax - pakainfo.com</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div class="container">
<h1>pagination jquery ajax laravel 5.7 - pakainfo.com</h1>
<div id="list_members">
@include('members')
</div>
</div>
<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{
retriveMembers(page);
}
}
});
$(document).ready(function()
{
$(document).on('click', '.pagination a',function(event)
{
event.preventDefault();
$('li').removeClass('active');
$(this).parent('li').addClass('active');
var liveurl = $(this).attr('href');
var page=$(this).attr('href').split('page=')[1];
retriveMembers(page);
});
});
function retriveMembers(page){
$.ajax(
{
url: '?page=' + page,
type: "get",
datatype: "html"
}).done(function(data){
$("#list_members").empty().html(data);
location.hash = page;
}).fail(function(jqXHR, ajaxOptions, thrownError){
alert('Sorry, No response from server');
});
}
</script>
</body>
</html>
resources/views/members.blade.php
<h1>pagination jquery ajax laravel 5.7</h1>
<table class="table table-bordered">
<thead>
<tr>
<th width="100px">ID</th>
<th>Name</th>
</tr>
</thead>
<tbody>
@foreach ($data as $value)
<tr>
<td>{{ $value->id }}</td>
<td>{{ $value->name }}</td>
</tr>
@endforeach
</tbody>
</table>
<p>Simple Jquery Ajax Pagination with Laravel 5.7 Example</p>
{!! $data->render() !!}
Save and then Run this Project
php artisan serve
open bellow URL and Run Laravel 5.7 Project
//Simple Ajax Pagination with Laravel 5.7 Example http://localhost:8000/simple-pagination
Angular 6 CRUD Operations Application Tutorials
Read :
Summary
You can also read about AngularJS, ASP.NET, VueJs, PHP.
I hope you get an idea about Simple Jquery Ajax Pagination with Laravel 5.7 Example.
I would like to have feedback on my Pakainfo.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.