» » » Multiple grids on one page in Yii2

Multiple grids on one page in Yii2

Recently I upgrade my application and I add two Gridview widgets on one page. Everything seems working fine until I notice the pagination of all Gridview widgets won’t work properly. There are two issues that I found.

 

Issue #1
One issue is every time I click on one of pagination of any Gridview widget, all paginations changed.

For example, I click on page number 5 of one of the paginations and other paginations change to 5 as well.

To fix this, you must add pageSizeParam and pageParam attributes for the pagination parameter of the data provider. Both attributes will set the unique name of the Gridview widget.

 

Issue #2

Another issue is the pagination link. When I click on the pagination of the first Gridview widget, the pagination link of the last Gridview widget will be added by the query parameter from the pagination of the first Gridview widget too.

To fix this, you must add params attributes for the pagination parameter of the data provider.

If you have any problem with column sorting in Gridview widget, you can add sortParam attribute to set the unique name.

 

Example

The code below shows how I use those attributes to fix the issues.

$request = Yii::$app->request;
$current_page = $request->get('trans-current-page');
$pages = 10;

$dataProvider = new ActiveDataProvider([
    'query' => $query,
    'pagination' => [                
        'pageSize' => $pages,
        'pageSizeParam' => 'trans-per-page',
        'pageParam' => 'trans-current-page',   
        'params' => [
            'trans-current-page' => $current_page,
            'trans-per-page' => $pages
        ]                              
    ],
    'sort' => [
        'sortParam' => 'trans-sort'
    ]
]);