Closed adwiv closed 4 years ago
onEachSide
shouldn't be used with anything lower than 2. I'll send in a PR to the docs to add a note about this.
@driesvints That will still leave issues with onEachSide for values different than 2 or 3, for ex 5 as I have shown above. Only 2 links on the right when close to beginning and 3 links on left when close to ending are shown as these values are hard-coded.
Would you be interested in a very small and simple PR that introduces no breaking changes and passes all tests while fixing the paginator for all values from 1 onwards?
@adwiv you can always attempt a PR but it's up to Taylor to decide if he wants it merged in.
This will be fixed in the next patch release.
Thanks a lot @taylorotwell for the patch.
There is a small change that I missed mentioning earlier.
When setting $window = $onEachSide + 4
we also need to change the condition when small slider is returned. The small slider should be returned whenever total pages is less than or equal to 2 + $onEachSide + 1 + $onEachSide + 2
i.e. last <= ($onEachSide * 2) + 7
Hence the condition in the UrlWindow::get()
method should be changed from ($onEachSide * 2) + 6)
to ($onEachSide * 2) + 8)
in Line 47
With the current patch we are getting unnecessary separators in edge cases (when total pages = 12 or 13 for onEachSide
set to default (3).
When this patch will be released to fix this? Not looking great using laravel6+bootstrap4 on cell phone. bootstrap4 has
laravel 5 + bootstrap 3 has no such problem.
Laravel 8 with Bootstrap 4.1 does not work as well.
Same with Laravel 9 and Bootstrap 4...
See https://wintertricks.com/tricks/paginator-with-limited-number-of-pages-displayed-at-once for an example of how you can render a completely custom paginator link window setup (example is in Twig but is easily extrapolated to Blade or PHP.
I'm wondering why this one was closed as #28789 and its references provides no good solutions.
On Laravel 9.8.1 and Bootstrap 4.6.1, this is what paginator provides by default:
So I came up with the following workaround:
<!-- On blade view (yeah, yeah... I know what they say about onEachSide() < 2 )-->
{!! $collection->onEachSide(1)->links() !!}
// Workaround Laravel Paginator Bad onEachSide #32943
// ---------------------------------------------------
@media (max-width: 575.98px) {
.page-link {
padding: 0.5rem 0;
width: 1.85rem;
}
}
Et voilà!
It may still brake after hundreds pages tho, but still better than broken by default.
IMHO the perfect solution when onEachSide(1)
would be (wich also extends to whatever > 1):
| < | 1 | ... | 8 | 9 | 10 | ... | 20 | > |
That clearly translates as 'one element on each side' developers expect while provides a predictable UX context:
No?
Laravel 10 + Bootstrap 5 not working
Laravel 10 + Bootstrap 4 not working!
Description:
The default paginator appears to be optimized for onEachSide value of 3, resulting in discrepancies when onEachSide is set to a different value.
Issues with onEachSide set to 1
In order to make a small pagination views that fits in the mobile device view-port, I used the
onEachSide()
method with value 1 and observed the following issues:The number 2 is repeated on both sides separator when current page is 3![image](https://user-images.githubusercontent.com/11003751/82739152-f28a7880-9d5a-11ea-8305-3a925a00b2e8.png)
The number (total pages - 1) is repeated when current page is (total pages - 2)![image](https://user-images.githubusercontent.com/11003751/82739181-2bc2e880-9d5b-11ea-9935-4bebd59cf402.png)
There are some more superficial issues like
The pagination view still does not fit within the small device view.![Screen Shot 2020-05-24 at 00 21 37](https://user-images.githubusercontent.com/11003751/82739114-96bfef80-9d5a-11ea-9f66-c2b413455700.png)
unnecessary separator (...) between 2 and 3 when current page is 4 and similar when current page is (total - 3).
unnecessary separator (...) between 2 and 4 which can be replaced with 3 when current page is 5.
Issues with onEachSide set to 5
When onEachSide is set to 5, a different set of issues arise.
Steps To Reproduce:
Create a pagination view for any query that returns more than 20 pages. {{ $query->paginate()->onEachSide(1)->links() }} {{ $query->paginate()->onEachSide(5)->links() }}
Suggestions/Bug Fixes
Bug Fix: The class
Illuminate\Pagination\UrlWindow
seems to be optimized for defaultonEachSide
value of 3. There are a lot of hardcoded assumptions that break when it is set to a value much different. For example, both the methodsgetSliderTooCloseToBeginning()
andgetSliderTooCloseToEnding()
has a hard coded value of 2 in page range which should be equal t to$onEachSide
and$onEachSide -1
respectively. Also, the value of$window
ingetUrlSlider()
should ideally be$onEachSide + 4
instead of current value of$onEachSide * 2
.Feature request: The paginator always shows 2 links on each end which results in minimum of 9 links being shown when onEachSide is set to 1. These many links can't fit in a xtra-small bootstrap screen. The suggestion is to either allow another setting
onEachEnd
on the paginator or assume the user wants a small paginator and show only one link on each end whenonEachSide
is set to 1.