Laravel Jquery Ajax Pagination Example From Scratch
In this post we will give you information about Laravel Jquery Ajax Pagination Example From Scratch. Hear we will give you detail about Laravel Jquery Ajax Pagination Example From ScratchAnd how to use it also give you demo for it if it is necessary.
Today, I am going to share with you how to make easy jquery ajax pagination example in Laravel Application from scratch tutorial.
As you know Pagination is a very basic requirement of Any Admin Panel, ERP or back-end Panel. Pagination help us to load few records every time, that way can not broken web page due to lots of data. If you are making pagination and do it using jquery ajax then it more beautiful. Ajax Pagination load only your table data instead of whole page. So ajax pagination is very helpful. In this post i am making very simple example of ajax pagination in Laravel 5.4 application.
Here, you have to just follow few step to create jquery ajax pagination example from scratch. So let’s follow few step:
Step 1 : Install Laravel Application
we are going from scratch, So we require to get fresh Laravel 5.4 application using bellow command, So open your terminal OR command prompt and run bellow command:
Laravel 5.5 group by doesn't work - fixed
In this post we will give you information about Laravel 5.5 group by doesn't work - fixed. Hear we will give you detail about Laravel 5.5 group by doesn't work - fixedAnd how to use it also give you demo for it if it is necessary.
Someday ago i just installed laravel 5.5 application and i was checking new feature and making some examples. But i was working on database query builder example one by one, i got following error when i used group by on single column.
My query was like as bellow example, so you can see on database query i simple get all users and group by with name. So, let's simply see how it is:
DB Query:
$users = DB::table("users")
->groupBy("name")
->get();
dd($users);
But when i run above query using database query builder i got following error, as you can see:
SQLSTATE[42000]: Syntax error or access violation: 1055 'laravel_test.users.id' isn't in GROUP BY (SQL: select * from 'users' group by 'name')
I was thinking what is the issue because without group by it was working, but at last i found it how to solve it So we have to simply "strict" mode make it true into false in database.php file. So let's do it as bellow:
config/database.php
...
'strict' => true,
To
'strict' => false,
....
After that i hope you found your solution.
Thank you...
Hope this code and post will helped you for implement Laravel 5.5 group by doesn't work - fixed. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs
composer create-project --prefer-dist laravel/laravel blog
Step 2 : Database Configuration
In this step, we require to make database configuration, you have to add following details on your .env file.
1.Database Username
2.Database Password
3.Database Name
In .env file also available host and port details, you can configure all details as in your system, So you can put like as bellow:
.env
DB_HOST=localhost
DB_DATABASE=homestead
DB_USERNAME=homestead
DB_PASSWORD=secret
Step 3: Create Item Table and Model
In this step we have to create migration for items table using Laravel 5.4 php artisan command, so first fire bellow command:
php artisan make:migration create_items_table
After this command you will find one file in following path database/migrations and you have to put bellow code in your migration file for create items table.
use IlluminateSupportFacadesSchema;
use IlluminateDatabaseSchemaBlueprint;
use IlluminateDatabaseMigrationsMigration;
class CreateItemsTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('items', function (Blueprint $table) {
$table->increments('id');
$table->string('title');
$table->string('description');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::drop("items");
}
}
After create “items” table you should create Item model for items, so first create file in this path app/Item.php and put bellow content in item.php file:
app/Item.php
<?php
namespace App;
use IlluminateDatabaseEloquentModel;
class Item extends Model
{
}
Step 4: Add New Route
In this is step we need to create routes for items listing. so open your routes/web.php file and add following route.
routes/web.php
Route::get('ajax-pagination',array('as'=>'pagination','uses'=>'HomeController@ajaxPagination'));
Step 5: Create Controller
In this step, we have to create two view file one for layout and another for data. now we should create new controller as HomeController in this path app/Http/Controllers/HomeController.php. this controller will manage all listing items and item ajax request and return response, so put bellow content in controller file:
app/Http/Controllers/HomeController.php
<?php
namespace AppHttpControllers;
use IlluminateHttpRequest;
use AppItem;
class HomeController extends Controller
{
/**
* Create a new controller instance.
*
* @return void
*/
public function __construct()
{
}
/**
* Listing Pagination Data.
*
* @return IlluminateHttpResponse
*/
public function ajaxPagination(Request $request)
{
$items = Item::paginate(5);
if ($request->ajax()) {
return view('data', compact('items'));
}
return view('items',compact('items'));
}
}
Step 6: Create View
In Last step, let’s create items.blade.php(resources/views/items.blade.php) for layout and lists all items code here and put following code:
resources/views/items.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Laravel Ajax Pagination Example</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div >
<h2>Items Data</h2>
<div id="item-lists">
@include('data')
</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{
getData(page);
}
}
});
$(document).ready(function()
{
$(document).on('click', '.pagination a',function(event)
{
$('li').removeClass('active');
$(this).parent('li').addClass('active');
event.preventDefault();
var myurl = $(this).attr('href');
var page=$(this).attr('href').split('page=')[1];
getData(page);
});
});
function getData(page){
$.ajax(
{
url: '?page=' + page,
type: "get",
datatype: "html",
})
.done(function(data)
{
$("#item-lists").empty().html(data);
location.hash = page;
})
.fail(function(jqXHR, ajaxOptions, thrownError)
{
alert('No response from server');
});
}
</script>
</body>
</html>
resources/views/data.blade.php
<table >
<thead>
<tr>
<th>Title</th>
<th>Description</th>
</tr>
</thead>
<tbody>
@foreach ($items as $item)
<tr>
<td>{{ $item->title }}</td>
<td>{{ $item->description }}</td>
</tr>
@endforeach
</tbody>
</table>
{!! $items->render() !!}
Make sure you have some dummy data on your items table before run this example. Now we are ready to run our example so run bellow command for quick run:
php artisan serve
Now you can open bellow URL on your browser:
http://localhost:8000/ajax-pagination
I hope it can help you…
Hope this code and post will helped you for implement Laravel Jquery Ajax Pagination Example From Scratch. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs