Geoff
Geoff

Reputation: 6649

yii2 pjax in the listview fails in pagination

I have a listview that i would like use pagination using pjax but the pagnation fails to work with pjax

This is what i have tried

<?php Pjax::begin([
                'id' => 'w0', //checked id on the inspect element

                'enablePushState' => true  // i would like the browser to change link
            ]); ?>

<?= ListView::widget([
                'summary' => false,
                'dataProvider' => $dataProvider,
                'emptyText' => "",//Yii::t('app', 'Sorry we have no items currently.'),
                'itemOptions' => ['class' => 'item'],
                'options' => ['data-pjax' => true ], //this is for pjax
                'layout' => '{items}{pager}',
                'pager' => [
                    'firstPageLabel' => 'First',
                    'lastPageLabel' => 'Last',
                    'maxButtonCount' => 5,
                    'options' => [
                        'class' => 'pagination col-xs-12'
                    ]
                ],
       'itemView' => function ($model, $key, $index, $widget) {

       return $this->render('_items_list', ['model' => $model]); //This shows one model 
                },
            ]) ?>

 <?php Pjax::end(); ?>

When i click on the items nothing hapens and when i remove the pjax opening and closing tags it works with normal page refresh what else do i need to add

Upvotes: 2

Views: 1698

Answers (1)

Gynteniuxas
Gynteniuxas

Reputation: 7103

You are close to your solution.

<?php Pjax::begin([
    'id' => 'w0', // checked id on the inspect element
    'enablePushState' => true  // I would like the browser to change link
    'timeout' => 10000 // Timeout needed
]); ?>

I have added only 1 line: 'timeout' => 10000. By default timeout is equal to 1000 (one second). Since you do not get back results within that 1 second, browser uses normal page refresh instead of Pjax. By replacing 1000 to 10000, you give 10x more time to get response (it shouldn't take that long but just in case). Now Pjax has enough to retrieve results from server and update ListView without reloading the page.

If you still get nothing, it is likely to be an error on server side. Check network (in browser) to see what server returns (it should return status 200).

Upvotes: 4

Related Questions