Question

我在yii2上使用TAB

<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>

我在控制器中的功能

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,
    ]);
}

我使用分页来分页1个标签（成员）的内容，但是当我点击2,3,4页时页面会自动刷新到默认标签组... 反正有没有在tab工作中进行分页？感谢

Answer 1

使用yii\widgets\Pjax，它只会获取pjax块内的内容

<?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() ?>

Answer 2

<强>原因：

当您点击分页链接页面时，由于jQuery或javascript插件，您会在视图中丢失状态。

<强>解决方案：

在你的控制器中添加：

    if (Yii::$app->request->get('page', false) != false) { // page is your pagination parameter
        $this->registerJs(
    "jQuery(document).ready(function(){ $('#member_tab').click() })",
    View::POS_END,
    'member_tab_clicker' // Unique Handler For JS Block
);
    }

在你的html更新链接中添加ID属性：

<a data-toggle="tab" href="#menu1" id="member_tab">Member</a>

确保在项目中包含了jquery。这不是标准方式，但它可以解决您的问题。

选项卡中的Yii2分页

2 个答案: