Twitter bootstrap Yii2选项卡内的分页

我正在和TAB一起研究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>

我使用分页来分页1个选项卡（成员）的内容，但是当我单击第2、3、4页时，页面会自动刷新为默认选项卡组…

---

有什么方法可以让标签内的页面工作吗？谢谢

使用

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

使用

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

原因：

当您单击分页链接页面时，页面会被刷新，并且由于

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。这不是标准的方法，但它会解决你的问题

原因：

当您单击分页链接页面时，页面会被刷新，并且由于

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。这不是标准方法，但它可以解决您的问题。

您应该动态应用活动css类。基于此类选项卡将显示在您的页面中。您应该动态应用活动css类。基于此类，选项卡将显示在您的页面中。非常感谢您。非常感谢您找到了解决方案，但我非常感谢您的帮助。谢谢你我找到了解决办法，但我真的很感谢你的帮助。非常感谢。