Hi,
if it can help, here is a paste of how I'm doing this (using previous/next button, instead of the link provided by volt):
(initial html )
<div class="liste-commandes-pager">
<div class="col-md-4 no-padd-no-margin">
<button class="btn-navig btn-previous-page" data-page="1">previous page</button>
</div>
<div class="col-md-4 no-padd-no-margin">
<div class="col-md-4 no-padd-no-margin">
<button class="btn-navig btn-first-page" data-page="1">first page</button>
</div>
<div class="col-md-4 no-padd-no-margin">
<button class="btn-navig btn-navig-info"></button>
</div>
<div class="col-md-4 no-padd-no-margin">
<button class="btn-navig btn-last-page" data-page="0">last page</button>
</div>
</div>
<div class="col-md-4 no-padd-no-margin">
<button class="btn-navig btn-next-page" data-page="2">next page </button>
</div>
</div>
javascript
(js)
$('.btn-previous-page, .btn-first-page').on('click', function (e) {
e.preventDefault();
var pageNumber = $(this).data('page');
getpagedCommandes('BC', pageNumber, "previous");
});
$('.btn-next-page, .btn-last-page').on('click', function (e) {
e.preventDefault();
var pageNumber = $(this).data('page');
getpagedCommandes('BC', pageNumber, "next");
});
....
//the ajax call, note that button's html is updated on reponse
function getpagedCommandes(type, pageNumber, direction) {
$.ajax({
type: "POST",
dataType: 'json',
data: {
type: type,
page: pageNumber
},
cache:false,
headers: {'HTTP_X_REQUESTED_WITH': 'XMLHttpRequest'},
url: serveurAdress + '/pieces/commandesJson',
complete: function (response) {
rep = jQuery.parseJSON(response.responseText);
$('.btn-last-page-liv').attr('data-page', pageCount);
switch(direction) {
case "next":
if(pageNumber !== pageCount) {
$('.btn-previous-page').css('display', 'block').data('page', pageNumber-1);
$('.btn-next-page').data('page', pageNumber+1);
}
else {
$('.btn-previous-page').css('display', 'block').data('page', pageNumber-1);
$('.btn-next-page').css('display', 'none');
}
break;
case "previous":
if(pageNumber !== 1) {
$('.btn-previous-page').css('display', 'block').data('page', pageNumber-1);
$('.btn-next-page').data('page', pageNumber+1);
}
else {
$('.btn-previous-page').css('display', 'none');
$('.btn-next-page').css('display', 'block').data('page', 2);
}
break;
}
$('.btn-navig-info').text(pageNumber + "/" +pageCount);
}
});
}
controller action:
public function commandesJsonAction()
{
if ($this->request->isPost()) {
if ($this->request->isAjax()) {
$this->view->disable();
$numberPage = $this->request->getPost('page', 'int');
$type = $this->request->getPost('type', 'string');
$conditions = 'pi_typepiece = :type:';
$bind = array(
'type' => $type,
);
$piecesBC = $this->_listingCommandes($conditions, $bind);
if (count($piecesBC) == 0) {
if ($this->request->isPost()) {
if ($this->request->isAjax()) {
if(strcmp($type, 'BC') == 0){
$this->jsonMessages['isCommandes'] = false;
}
else if (strcmp($type, 'BLC') == 0){
$this->jsonMessages['isLivraisons'] = false;
}
else if (strcmp($type, 'FAC') == 0){
$this->jsonMessages['isFactures'] = false;
}
return $this->jsonMessages;
}
}
}
$paginator = new Paginator(array(
"data" => $piecesBC,
"limit"=> 100,
"page" => $numberPage
));
$res = $paginator->getPaginate();
if(strcmp($type, 'BC') == 0) {
Feedback::notice('Commandes: page ' . $numberPage);
$this->jsonMessages['isCommandes'] = true;
$this->jsonMessages['listeCommandes'] = $res;
}
else if(strcmp($type, 'BLC') == 0) {
Feedback::notice('Livraisons: page ' . $numberPage);
$this->jsonMessages['isLivraisons'] = true;
$this->jsonMessages['listeLivraisons'] = $res;
}
else if(strcmp($type, 'FAC') == 0) {
Feedback::notice('Factures: page ' . $numberPage);
$this->jsonMessages['isFactures'] = true;
$this->jsonMessages['listeFactures'] = $res;
}
return $this->jsonMessages;
}
}
}