My response looks like this:
"links": {
"first": "http://localhost:8000/api/tasks?page=1",
"last": "http://localhost:8000/api/tasks?page=200",
"prev": null,
"next": "http://localhost:8000/api/tasks?page=2"
},
"meta": {
"current_page": 1,
"from": 1,
"last_page": 200,
"links": [
{
"url": null,
"label": "« Previous",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=1",
"label": "1",
"active": true
},
{
"url": "http://localhost:8000/api/tasks?page=2",
"label": "2",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=3",
"label": "3",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=4",
"label": "4",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=5",
"label": "5",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=6",
"label": "6",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=7",
"label": "7",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=8",
"label": "8",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=9",
"label": "9",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=10",
"label": "10",
"active": false
},
{
"url": null,
"label": "...",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=199",
"label": "199",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=200",
"label": "200",
"active": false
},
{
"url": "http://localhost:8000/api/tasks?page=2",
"label": "Next »",
"active": false
}
],
"path": "http://localhost:8000/api/tasks",
"per_page": 2,
"to": 2,
"total": 400
}
I can make use of the first links
, and just use those, but I still want to have the numbered links, as Laravel gives them back, meaning: goes from 1 to 10, has a "…" link, then some from the last links.
Is there a way to do that on the API? I don’t want to splice the first and last links all the time on the frontend and so-far, that’s the only suggested solution I’ve found.
Or if there’s a way to just return the numbered links as I mentioned above, that would be amazing too!
Edit:
I tried the boot method suggestion, this is how it looks:
<?php
namespace AppProviders;
use IlluminateSupportServiceProvider;
use IlluminateHttpResourcesJsonJsonResource;
class AppServiceProvider extends ServiceProvider
{
/**
* Register any application services.
*/
public function register(): void
{
//
}
/**
* Bootstrap any application services.
*/
public function boot(): void
{
JsonResource::macro('paginationInformation', function ($request, $paginated, $default) {
// change it however you want...
unset($default['links']['prev']);
unset($default['links']['next']);
return $default;
});
}
}
and then my resource:
<?php
namespace AppHttpResources;
use IlluminateHttpRequest;
use IlluminateHttpResourcesJsonJsonResource;
class TaskResource extends JsonResource
{
/**
* Transform the resource into an array.
*
* @return array<string, mixed>
*/
public function toArray(Request $request): array
{
return [ ... returning my stuff ... ]
But it still includes the prev-next links, so they’re not unset.
I also tried modifying it to $default['meta']['links']['prev']
and next
, but that didn’t solve it either.
2
Answers
The final solution turned out to use "DataTables". That, and a "custom" combination of returning the data and the total. With that, DataTables handles the pagination completely, while the laravel API returns only what is requested.
Something similar:
https://datatables.net/examples/data_sources/ajax
Using API resources you can modify this creating a macro on
JsonResource
in your AppServiceProvider’s boot methodHad to sourcedive to find this
https://github.com/laravel/framework/blob/0c574d42e9c7d82a0bd304a5cb2ce031a914bfa6/src/Illuminate/Http/Resources/Json/PaginatedResourceResponse.php#L53