I wanted to add pagination to my project and followed a tutorial for that. When I click new page the results are not changing.
In my Controller I added this $competitions = Competition::latest()->paginate(1);
Then into app/Providers/AppServiceProvider added this use Illuminate\Pagination\Paginator; and inside the boot function added this: Paginator::useBootstrap();
And the last thing was to add this {{ $competitions->onEachSide(1)->links() }} after I close my table in the blade file.
EDIT:
Controller function:
public function index()
{
$competitions = Competition::latest()->paginate(1);
return view('competition.index', compact('competitions'));
}
Loop in blade:
#foreach ($competitions as $competition)
<tbody >
#switch($competition->status)
#case('active')
<tr>
#break
#case('to_push')
<tr class="bg-secondary">
#break
#case('inactive')
<tr class="bg-warning">
#break
#default
<tr>
#endswitch
<td>{{ $competition->id }}</td>
<td>{{ $competition->name }}</td>
<td>{{ $competition->status }}</td>
<td>{{ $competition->mode }}</td>
<td>{{ $competition->type }}</td>
<td>{{ $competition->frequency }}</td>
<td>{{ $competition->last_push }}</td>
<td>{{ $competition->next_push }}</td>
<td class="text-center"><a class="btn btn-info btn-sm" href="{{ route('events.list_by_competition',['competition' => $competition->id]) }}">Events</a></td>
<td class="text-center"><a class="btn btn-info btn-sm" href="{{ route('competitions.exports',$competition->id) }}">Exports</a></td>
<td class="text-center">
<form action="{{ route('competitions.destroy',$competition->id) }}" method="POST">
<a class="btn btn-primary btn-sm" href="{{ route('competitions.edit',$competition->id) }}">Edit</a>
#csrf
#method('DELETE')
<button type="submit" class="btn btn-danger btn-sm">Delete</button>
</form>
</td>
</tr>
</tbody>
#endforeach
</table>
{{ $competitions->links('pagination::bootstrap-5') }}
dd(Competition::all()) returns the 4 records I have
Can you please tell me what I did wrong? Any and all help gratefully received.
$competitions = Competition::latest()->paginate(1) this command will return you one result and then pagination will take 1 per page so it won't be shown at all.
Try something like this in your controller
$competitions = Competition::paginate(1)
return view(...., ['competitions' => $competitions]);
and in your blade add this under the foreach loop where you display data
{{ $competitions->links() }}
Read more here
HERE IS HOW TO MAKE PAGINATION
BLADE
#foreach($paginate as $p)
{{ $p->name }} <br>
#endforeach
{{ $paginate->links() }}
CONTROLLER
return view('backend.test', [
'paginate' => Product::paginate(5)
]);
I added pagination in my application. The same results are displayed on each page and according to the URL, the pages are definitely changing. I've tried a ton of solutions but none worked. Please help me find what I did wrong
My Controller:
public function index(Request $request)
{
$competitions = Competition::latest()->paginate(1);
return view('competition.index', compact('competitions'));
}
Inside app/Providers/AppServiceProvider I added use Illuminate\Pagination\Paginator; and my function looks like this:
public function boot()
{
Paginator::useBootstrap();
}
That's how I loop in view:
#foreach ($competitions as $competition)
<tbody >
#switch($competition->status)
#case('active')
<tr>
#break
#case('to_push')
<tr class="bg-secondary">
#break
#case('inactive')
<tr class="bg-warning">
#break
#default
<tr>
#endswitch
<td>{{ $competition->id }}</td>
<td>{{ $competition->name }}</td>
<td>{{ $competition->status }}</td>
<td>{{ $competition->mode }}</td>
<td>{{ $competition->type }}</td>
<td>{{ $competition->frequency }}</td>
<td>{{ $competition->last_push }}</td>
<td>{{ $competition->next_push }}</td>
<td class="text-center"><a class="btn btn-info btn-sm" href="{{ route('events.list_by_competition',['competition' => $competition->id]) }}">Events</a></td>
<td class="text-center"><a class="btn btn-info btn-sm" href="{{ route('competitions.exports',$competition->id) }}">Exports</a></td>
<td class="text-center">
<form action="{{ route('competitions.destroy',$competition->id) }}" method="POST">
<a class="btn btn-primary btn-sm" href="{{ route('competitions.edit',$competition->id) }}">Edit</a>
#csrf
#method('DELETE')
<button type="submit" class="btn btn-danger btn-sm">Delete</button>
</form>
</td>
</tr>
</tbody>
#endforeach
</table>
{{ $competitions->links() }}
Into my laravel application while I am fetching data by eager loading order by showing me the correct format of data in dd i.e. the data in DESC format, but while i am compacting data and trying to show it in blade it shows the data in ASC format...
My controller
public function index(Request $request)
{
$data = Rate::with('hospital')->orderBy('id','DESC')->get();
// dd($data );
return view('admin.rates.index',compact('data'));
}
My blade file
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
{{-- <th>No</th> --}}
<th>Hospital</th>
<th>Contract Date</th>
<th class="text-center">Contract Length (weeks)</th>
<th>Weekly</th>
<th>Hourly</th>
<th>Others</th>
{{-- <th>Status</th> --}}
<th>Action</th>
</tr>
</thead>
<tbody>
<?php $i=0; ?>
#foreach ($data as $key => $rate)
<tr>
{{-- <td>{{++$i}}</td> --}}
<td>
{{ ucwords($rate->hospital->short_name) }}
</td>
<td>
{{date('m/d/Y',strtotime($rate->contract_date))}}
</td>
<td class="text-center">
{{ $rate->contract_duration}}
</td>
<td class="text-right">
{{ ($rate->weekly_rate != '') ? $rate->weekly_rate : '' }}
</td>
<td class="text-right">
{{ ($rate->hourly_rate != '') ? $rate->hourly_rate : '' }}
</td>
<td class="text-right">
{{ ($rate->others_rate != '') ? $rate->others_rate : '' }}
</td>
{{-- <td>
</td> --}}
<td>
#if ($rate->status=='inactive')
<i class="fas fa-times"></i>
#else
<i class="fas fa-check"></i>
#endif
<a class="btn btn-sm btn-info" href="{{ route('rate.edit',$rate->id) }}"><i class="fas fa-edit"></i></a>
<a class="btn btn-sm btn-danger" onclick="return confirm('Are you sure you want to delete')" href="{{ route('rate.destroy',$rate->id) }}"><i class="fas fa-trash"></i></a>
</td>
</tr>
#endforeach
</tbody>
</table>
There is nothing much more in it but why the data are not showing in DESC format is my question??? I am also pasting my dd image below where you can see the first data has the id 8 and the second one id 7 which is totally correct but while fetching id 7 comes first why??
When you are using datatable it tries to filter or sort the data in nearest alphabetical order if serial number is not in use I saw that you have closed tag for serial no try to open it and check the result. I am quite sure it is due to that... Just try to use "ordering": false into your datatable function..
I am using Laravel and I want to delete record from admin panel with button
so I want to use Ajax to does not refresh page when I want to delete
so problem is this
when I click on button the record is going to delete but the page does not show any change ( I mean the record is deleted but it's still in page and when I refresh the page It's going to hide and delete)
controller :
$comment = Comment::find($id);
$comment->delete($id);
view:
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">{{ __('comment.index.comments') }}</h1>
<div class="btn-toolbar mb-2 mb-md-0">
<div class="btn-group mr-2">
{{--{{ __('comment.index.create') }}--}}
{{--Export--}}
</div>
{{--<button class="btn btn-sm btn-outline-secondary dropdown-toggle">--}}
{{--<i class="fa fa-calendar-o"></i>--}}
{{--This week--}}
{{--</button>--}}
<span>
Excel <i class="fas fa-cloud-download-alt"></i>
Create <i class="fas fa-plus-square"></i>
</span>
</div>
</div>
<div class="table-responsive">
<table class="table table-striped table-sm">
<thead>
<tr>
<th>{{ __('comment.index.id') }}</th>
<th>{{ __('comment.index.user-id') }}</th>
<th>{{ __('comment.index.parent-id') }}</th>
<th>{{ __('comment.index.comment') }}</th>
<th>{{ __('comment.index.commentable-id') }}</th>
<th>{{ __('comment.index.commentable-type') }}</th>
<th>{{ __('comment.index.status') }}</th>
<th>{{ __('comment.index.data') }}</th>
<th>{{ __('comment.index.setting') }}</th>
</tr>
</thead>
<tbody>
#foreach($comments as $comment)
<tr>
<td>{{ $comment->id }}</td>
<td>{{ $comment->user_id }}</td>
<td>{{ $comment->parent_id }}</td>
<td>{{ $comment->comment }}</td>
<td>{{ $comment->commentable_id }}</td>
<td>{{ $comment->commentable_type }}</td>
<td>{{ $comment->status }}</td>
<td>{{ \Carbon\Carbon::parse($comment->created_at)->diffForHumans() }}</td>
<td>
{{--<form action="{{ route('change.approved', $comment->id) }}" method="post">--}}
{{--#csrf--}}
{{--{{ method_field('put') }}--}}
{{--<input value="change approved {{ $comment->approved }}" type="submit" class="btn btn-sm btn-success">--}}
{{--</form>--}}
{{--<form action="{{ route('comment.destroy', $comment->id) }}" method="post">--}}
{{--#csrf--}}
{{--{{ method_field('delete') }}--}}
{{--<input value="delete" type="submit" class="btn btn-sm btn-danger">--}}
{{--</form>--}}
<form class="form-inline" action="{{ route('change.approved', $comment->id) }}" method="post">
#csrf
{{ method_field('put') }}
{{--<input value="" >--}}
<button type="submit" class="btn btn-link"><i class="fa #if( $comment->approved == 1) fa-toggle-on text-success #else fa-toggle-off text-secondary #endif"></i> approved</button>
</form>
<hr class="p-0 m-1">
<button class="deleteProduct" data-id="{{ $comment->id }}" data-token="{{ csrf_token() }}" >Delete Task</button>
#csrf
{{ method_field('delete') }}
{{--<input value="delete">--}}
<button class="btn btn-sm btn-danger" type="submit"><i class="fa fa-trash"></i></button>
</form>
</td>
</tr>
#endforeach
</tbody>
</table>
</div>
<script>
$(".deleteProduct").click(function() {
var id = $(this).data("id");
var token = $(this).data("token");
$.ajax(
{
url: "comment/delete/"+id,
type: 'DELETE',
dataType: "JSON",
data: {
"id": id,
"_method": 'DELETE',
"_token": token,
},
success: function ()
{
console.log("it Work");
}
});
console.log("It failed");
});
</script>
and route :
Route::delete('/comment/delete/{id}', 'admin\CommentController#destroy')->name('comment.destroy');
By the way I use AJAX in my view
Add comment id in tr tag so that every tr tag will be unique. On success of ajax remove that row(tr) by using comment id.
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">{{ __('comment.index.comments') }}</h1>
<div class="btn-toolbar mb-2 mb-md-0">
<div class="btn-group mr-2">
{{--{{ __('comment.index.create') }}--}}
{{--Export--}}
</div>
{{--<button class="btn btn-sm btn-outline-secondary dropdown-toggle">--}}
{{--<i class="fa fa-calendar-o"></i>--}}
{{--This week--}}
{{--</button>--}}
<span>
Excel <i class="fas fa-cloud-download-alt"></i>
Create <i class="fas fa-plus-square"></i>
</span>
</div>
</div>
<div class="table-responsive">
<table class="table table-striped table-sm">
<thead>
<tr>
<th>{{ __('comment.index.id') }}</th>
<th>{{ __('comment.index.user-id') }}</th>
<th>{{ __('comment.index.parent-id') }}</th>
<th>{{ __('comment.index.comment') }}</th>
<th>{{ __('comment.index.commentable-id') }}</th>
<th>{{ __('comment.index.commentable-type') }}</th>
<th>{{ __('comment.index.status') }}</th>
<th>{{ __('comment.index.data') }}</th>
<th>{{ __('comment.index.setting') }}</th>
</tr>
</thead>
<tbody>
#foreach($comments as $comment)
<tr id="{{ $comment->id }}">
<td>{{ $comment->id }}</td>
<td>{{ $comment->user_id }}</td>
<td>{{ $comment->parent_id }}</td>
<td>{{ $comment->comment }}</td>
<td>{{ $comment->commentable_id }}</td>
<td>{{ $comment->commentable_type }}</td>
<td>{{ $comment->status }}</td>
<td>{{ \Carbon\Carbon::parse($comment->created_at)->diffForHumans() }}</td>
<td>
<form class="form-inline" action="{{ route('change.approved', $comment->id) }}" method="post">
#csrf
{{ method_field('put') }}
<button type="submit" class="btn btn-link"><i class="fa #if( $comment->approved == 1) fa-toggle-on text-success #else fa-toggle-off text-secondary #endif"></i> approved</button>
</form>
<hr class="p-0 m-1">
<button class="deleteProduct" data-id="{{ $comment->id }}" data-token="{{ csrf_token() }}" >Delete Task</button>
#csrf
{{ method_field('delete') }}
{{--<input value="delete">--}}
<button class="btn btn-sm btn-danger" type="submit"><i class="fa fa-trash"></i></button>
</form>
</td>
</tr>
#endforeach
</tbody>
</table>
</div>
<script>
$(".deleteProduct").click(function(){
var id = $(this).data("id");
var token = $(this).data("token");
$.ajax(
{
url: "comment/delete/"+id,
type: 'DELETE',
dataType: "JSON",
data: {
"id": id,
"_method": 'DELETE',
"_token": token,
},
success: function ()
{
console.log("it Work");
$("tr#"+id).remove();
}
});
console.log("It failed");
});
</script>
Just do it.
<script>
$(".deleteProduct").click(function(){
var btn = $(this);
var id = $(this).data("id");
var token = $(this).data("token");
$.ajax(
{
url: "comment/delete/"+id,
type: 'DELETE',
dataType: "JSON",
data: {
"id": id,
"_method": 'DELETE',
"_token": token,
},
success: function ()
{
btn.closest("tr").remove(); // closest tr removed
console.log("it Work");
}
});
console.log("It failed");
});
You just hide that row by click on it. some like that...
$(".deleteProduct").click(function(){
$(this).closest("tr").hide();
var id = $(this).data("id");
var token = $(this).data("token");
$.ajax(
{
url: "comment/delete/"+id,
type: 'DELETE',
dataType: "JSON",
data: {
"id": id,
"_method": 'DELETE',
"_token": token,
},
success: function ()
{
console.log("it Work");
}
});
console.log("It failed");
});
Hope this help..
You may use this in after success response
you have to modify your script
<script>
$(".deleteProduct").click(function(){
var id = $(this).data("id");
var token = $(this).data("token");
$.ajax(
{
url: "comment/delete/"+id,
type: 'DELETE',
dataType: "JSON",
data: {
"id": id,
"_method": 'DELETE',
"_token": token,
},
success: function ()
{
$(this).closest("tr").remove();
alret('record deleted success fully');//or whatever type alert you want to show
}
});
console.log("It failed");
});
When refresh the page then my content broken, I couldn't understand why this happening. Some time's my whole page broken. Please help me to solve this problem.
Bootstrap v: 3.3.7
laravel v: 5.4
Here is my code:
#extends('layouts.admin-user.main')
#section('main_content')
<div class="ptb-80">
<div class="users-mang">
<div class="container">
<div class="row">
<div class="col-md-12">
#include('layouts.success')
#include('layouts.errors')
<h1>User Management</h1>
<div class="portlet-title">
<div class="caption font-dark">
#if(isset($searchData))
<a href="#if (isset($companyData->company_name)){{ url($companyData->company_name.'/user-list') }}#endif"
class="btn btn-info">Back to User List</a>
#else
<a href="#if (isset($companyData->company_name)){{ url($companyData->company_name.'/user') }}#endif"
class="btn btn-success">Add User</a>
Import User
#endif
</div>
<div class="tools"> </div>
</div>
<table class="table table-striped table-bordered table-hover" id="sample_1">
<thead>
<tr>
<th>#</th>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Group</th>
<th>Action</th>
</tr>
</thead>
<tbody>
#if(isset($allData) && !$allData->isEmpty())
<?php $i = 0; ?>
#foreach($allData as $data)
<?php $i++; ?>
<tr>
<td>{{ $i }}</td>
<td>{{ $data->name }}</td>
<td>{{ $data->email }}</td>
<td>{{ $data->phone }}</td>
<td>{{ $data->group_id }}</td>
<td>
<a href="#if (isset($companyData->company_name)){{ url($companyData->company_name.'/user/contact/'.$data->id) }}#endif"
class="btn btn-info">Contact</a>
<a href="#if (isset($companyData->company_name)){{ url($companyData->company_name.'/user/edit/'.$data->id) }}#endif"
class="btn btn-primary">Edit</a>
<a href="#if (isset($companyData->company_name)){{ url($companyData->company_name.'/user/delete/'.$data->id) }}#endif"
onclick="return confirm('Are you sure?')"
class="btn btn-danger">Delete</a>
</td>
</tr>
#endforeach
#else
<tr>
<td colspan="6" class="text-center"> No available data.</td>
</tr>
#endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
#endsection
Here is a broken content screenshot:
Thanks so much.