Yii2 pagination within tabs

Question

I’m working with TAB on yii2

<div class="container">
  <center><h1>Team</h1></center>
  <ul class="nav nav-tabs nav-justified">
    <li class="active"><a data-toggle="tab" href="#home">Introduction</a></li>
 <li><a data-toggle="tab" href="#menu1">Member</a></li>
  </ul>

  <div class="tab-content">
<div id="home" class="tab-pane fade in active">
      <h3>About</h3>
   <p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sit amet tempus arcu, in placerat ex. Ut laoreet ornare dui quis maximus. Aenean sit amet tristique urna, in scelerisque augue. Sed sodales mi sit amet lectus efficitur rutrum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin congue lectus id erat tempor vulputate. Curabitur in blandit odio, convallis posuere metus. Pellentesque dictum magna non purus ultrices viverra. Vestibulum ex orci, porttitor ac semper at, posuere sed turpis. Aenean varius libero id orci scelerisque egestas. Etiam dapibus ante ut mattis fringilla. Donec metus velit, vulputate sit amet laoreet at, pellentesque id risus. Phasellus tincidunt commodo mauris, iaculis aliquet nisl facilisis a.
</p>
   </div>
 <div id="menu1" class="tab-pane fade">
      <?php foreach($models as $model) { ?>
      <h3><?=$model->id; ?></h3>
      <p><?=$model->name; ?></p>
   <?php } ?>
   <?php echo \yii\widgets\LinkPager::widget([
    'pagination' => $pagination,
]); ?>
  </div>
</div>

My function in controller

public function actionIndex()
{
    $query = Teams::find();
    $teams = $query->all();
    $count = count($teams);
    $pagination = new Pagination(['totalCount' => $count, 'pageSize'=>10]);
    $models = $query->offset($pagination->offset)
    ->limit($pagination->limit)
    ->all();
return $this->render('index', [
        'models' => $models,
        'pagination' => $pagination,
    ]);
}

I used pagination to paging content of 1 tab (member), but the page is automatically refresh to default tab Team when I click to page 2,3,4… Is there anyways to make paging inside tab working? Thanks

Answer 1

Use yii\widgets\Pjax, it's gonna fetch the content inside the pjax's block only

<?php Pjax::begin() ?>
    <?php foreach($models as $model) { ?>
        <h3><?=$model->id; ?></h3>
        <p><?=$model->name; ?></p>
    <?php } ?>
    <?php echo \yii\widgets\LinkPager::widget([
        'pagination' => $pagination,
    ]); ?>
<?php Pjax::end() ?>