Skip to content

Commit 91dbf48

Browse files
update
1 parent dca5a41 commit 91dbf48

File tree

4 files changed

+133
-26
lines changed

4 files changed

+133
-26
lines changed

src/Schema/Builder.php

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1443,11 +1443,6 @@ public function paginate($perPage = 15, $pageParam = 'page')
14431443

14441444
// paginator data
14451445
$results = $paginator->getPagination($totalCount, $perPage, $this);
1446-
1447-
1448-
// dd(
1449-
// $results
1450-
// );
14511446

14521447
return new Collection($results['data'], $results['builder']);
14531448
}

src/Schema/Pagination/Paginator.php

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,8 @@ public function links(?array $options = [])
150150
'nextPageLabel' => $settings['next'],
151151
'prevPageLabel' => $settings['prev'],
152152
'buttonCount' => $settings['buttons'],
153+
// Enable AJAX by default with progressive enhancement
154+
'linkAttributes' => ['data-pagination' => 'ajax'],
153155
]) . "{$getStyle}";
154156
}
155157

Lines changed: 61 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,65 @@
1-
<div class="pagination ">
2-
3-
<div class="pagination-cursor">
4-
<?php if($isFirst):?>
5-
<span <?=$linkAttributes?>><?=$this->prevPageLabel?></span>
6-
<?php else: ?>
7-
<a <?=$linkAttributes?> href="<?=$this->pagination->createUrl($page-1);?>"><?=$this->prevPageLabel?></a>
8-
<?php endif ?>
1+
<div data-pagination-scope>
2+
<div class="pagination ">
93

10-
<?php foreach ($this->_buttonStack as $key => $btnPage): ?>
11-
<a <?=$linkAttributes?> class="<?php if(($page)==$btnPage):?>active<?php endif ?>" href="<?=$this->pagination->createUrl($btnPage);?>"><?=$btnPage?></a>
12-
<?php endforeach ?>
4+
<div class="pagination-cursor">
5+
<?php if($isFirst):?>
6+
<span <?=$linkAttributes?>><?=$this->prevPageLabel?></span>
7+
<?php else: ?>
8+
<a <?=$linkAttributes?> data-target="[data-pagination-content]" href="<?=$this->pagination->createUrl($page-1);?>"><?=$this->prevPageLabel?></a>
9+
<?php endif ?>
1310

14-
<?php if($isLast):?>
15-
<span <?=$linkAttributes?>><?=$this->nextPageLabel?></span>
16-
<?php else: ?>
17-
<a <?=$linkAttributes?> href="<?=$this->pagination->createUrl($page+1);?>"><?=$this->nextPageLabel?></a>
18-
<?php endif ?>
11+
<?php foreach ($this->_buttonStack as $key => $btnPage): ?>
12+
<a <?=$linkAttributes?> data-target="[data-pagination-content]" class="<?php if(($page)==$btnPage):?>active<?php endif ?>" href="<?=$this->pagination->createUrl($btnPage);?>"><?=$btnPage?></a>
13+
<?php endforeach ?>
14+
15+
<?php if($isLast):?>
16+
<span <?=$linkAttributes?>><?=$this->nextPageLabel?></span>
17+
<?php else: ?>
18+
<a <?=$linkAttributes?> data-target="[data-pagination-content]" href="<?=$this->pagination->createUrl($page+1);?>"><?=$this->nextPageLabel?></a>
19+
<?php endif ?>
20+
</div>
21+
1922
</div>
23+
</div>
24+
<script>
25+
// Lightweight progressive AJAX for pagination (cursor view)
26+
(function(){
27+
if(window.__TAME_PAGINATION_INITED__) return;
28+
window.__TAME_PAGINATION_INITED__ = true;
29+
30+
function closestAnchor(el){
31+
while(el && el !== document){ if(el.tagName === 'A') return el; el = el.parentNode; }
32+
return null;
33+
}
34+
35+
document.addEventListener('click', function(e){
36+
var a = closestAnchor(e.target);
37+
if(!a) return;
38+
if(a.getAttribute('data-pagination') !== 'ajax') return;
39+
var href = a.getAttribute('href');
40+
if(!href) return;
41+
e.preventDefault();
42+
43+
var targetSelector = a.getAttribute('data-target') || '[data-pagination-content]';
44+
var scope = a.closest('[data-pagination-scope]');
45+
var container = document.querySelector(targetSelector);
46+
if(!container || !scope){ window.location.href = href; return; }
2047

21-
</div>
48+
a.setAttribute('aria-busy', 'true');
49+
fetch(href, { headers: { 'X-Requested-With': 'XMLHttpRequest' }})
50+
.then(function(res){ return res.text(); })
51+
.then(function(html){
52+
var parser = new DOMParser();
53+
var doc = parser.parseFromString(html, 'text/html');
54+
var newContainer = doc.querySelector(targetSelector);
55+
var newScope = doc.querySelector('[data-pagination-scope]');
56+
if(!newContainer || !newScope){ window.location.href = href; return; }
57+
container.innerHTML = newContainer.innerHTML;
58+
scope.replaceWith(newScope);
59+
try { window.history.pushState({}, '', href); } catch(_e) {}
60+
})
61+
.catch(function(){ window.location.href = href; })
62+
.finally(function(){ a.removeAttribute('aria-busy'); });
63+
});
64+
})();
65+
</script>
Lines changed: 70 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="load-more-container" style="text-align: center; margin: 20px 0;">
1+
<div class="load-more-container" data-pagination-scope style="text-align: center; margin: 20px 0;">
22
<?php
33
$page = $this->pagination->page;
44
$totalPages = $this->pagination->pageCount;
@@ -7,10 +7,76 @@
77
$nextUrl = $this->pagination->createUrl($nextPage);
88
?>
99
<?php if (!$isLast): ?>
10-
<button type="button" class="load-more-btn" data-page="<?php echo $nextPage; ?>" data-url="<?php echo $nextUrl; ?>" style="padding: 10px 20px; background-color: #007bff; color: white; border: none; border-radius: 5px; cursor: pointer;">
10+
<a <?=$linkAttributes?> href="<?php echo $nextUrl; ?>" class="load-more-btn" data-page="<?php echo $nextPage; ?>" data-mode="append" data-target="[data-pagination-append]" style="padding: 10px 20px; background-color: #007bff; color: white; border: none; border-radius: 5px; cursor: pointer; text-decoration: none; display: inline-block;">
1111
Load More
12-
</button>
12+
</a>
1313
<?php else: ?>
1414
<p>No more content to load.</p>
1515
<?php endif; ?>
16-
</div>
16+
</div>
17+
<script>
18+
// Lightweight progressive AJAX for pagination (load-more friendly)
19+
(function(){
20+
if(window.__TAME_PAGINATION_INITED__) return; // Guard against multiple inits
21+
window.__TAME_PAGINATION_INITED__ = true;
22+
23+
function closestAnchor(el){
24+
while(el && el !== document){
25+
if(el.tagName === 'A') return el;
26+
el = el.parentNode;
27+
}
28+
return null;
29+
}
30+
31+
document.addEventListener('click', function(e){
32+
33+
e.preventDefault();
34+
35+
var a = closestAnchor(e.target);
36+
if(!a) return;
37+
if(a.getAttribute('data-pagination') !== 'ajax') return;
38+
39+
var href = a.getAttribute('href');
40+
if(!href) return;
41+
42+
var mode = a.getAttribute('data-mode') || 'replace';
43+
var targetSelector = a.getAttribute('data-target') || '[data-pagination-content]';
44+
var scope = a.closest('[data-pagination-scope]');
45+
var container = document.querySelector(targetSelector);
46+
47+
// Fallback when no container or scope found
48+
if(!container || !scope){ window.location.href = href; return; }
49+
50+
a.setAttribute('aria-busy', 'true');
51+
52+
fetch(href, { headers: { 'X-Requested-With': 'XMLHttpRequest' }})
53+
.then(function(res){ return res.text(); })
54+
.then(function(html){
55+
var parser = new DOMParser();
56+
var doc = parser.parseFromString(html, 'text/html');
57+
58+
var newContainer = doc.querySelector(targetSelector);
59+
var newScope = doc.querySelector('[data-pagination-scope]');
60+
61+
if(!newContainer || !newScope){ window.location.href = href; return; }
62+
63+
if(mode === 'append'){
64+
// Append children
65+
while(newContainer.firstChild){
66+
container.appendChild(newContainer.firstChild);
67+
}
68+
} else {
69+
// Replace content
70+
container.innerHTML = newContainer.innerHTML;
71+
}
72+
73+
// Replace controls to keep next/prev in sync
74+
scope.replaceWith(newScope);
75+
76+
try { window.history.pushState({}, '', href); } catch(_e) {}
77+
})
78+
.catch(function(){ window.location.href = href; })
79+
.finally(function(){ a.removeAttribute('aria-busy'); });
80+
});
81+
})();
82+
</script>

0 commit comments

Comments
 (0)