yii使用bootstrap分頁樣式的實例

Bootstrap是Twitter推出的一個開源的用於前端開發的工具包。它是由Twitter的設計師Mark Otto和Jacob Thornton合作開發，是一個CSS/HTML框架。 Bootstrap提供了優雅的HTML和CSS規範，它也就是由動態CSS語言Less寫成。 Bootstrap一推出後頗受歡迎，一直是GitHub上的熱門開源項目，包括NASA的MSNBC（微軟全國廣播公司）的Breaking News都使用了該項目。

本文為大家介紹的是yii使用bootstrap分頁樣式方法，有興趣的同學參考下。

yii自帶了分頁類和頁面樣式，但如果是yii+bootstrap開發的項目如何在不修改yii的情況下使用bootstrap分頁樣式呢。

本文就為大家介紹一個非常簡單的方式，想在yii的分頁中套用bootstrap樣式主要依賴yii CLinkPager中的二個屬性htmlOptions和selectedPageCssClass

控制器範例程式碼

public function actionIndex()
{
 $cid = intval($_GET['cid']);
 
 $criteria = new CDbCriteria();
 $criteria->addCondition("t.status=1");
 $criteria->addCondition("cid='$cid'");
 $criteria->order="t.time desc";
 $count = Article::model()->count($criteria);
 $pager = new CPagination($count);
 $pager->pageSize=20;
 $pager->applyLimit($criteria);
 $lists = Article::model()->findAll($criteria);
 
 $this->render('index',array('lists'=>$lists,"pager"=>$pager));
}

上面實作了yii分頁程式碼，並把$pager分頁物件傳到視圖裡，我們再來看一下視圖程式碼

視圖程式碼

<nav>
<?php
$this->widget(&#39;CLinkPager&#39;,array(
    &#39;header&#39;=>&#39;&#39;,
    &#39;firstPageLabel&#39; => &#39;首页&#39;,
    &#39;lastPageLabel&#39; => &#39;末页&#39;,
    &#39;prevPageLabel&#39; => &#39;上一页&#39;,
    &#39;nextPageLabel&#39; => &#39;下一页&#39;,
    &#39;pages&#39; => $pager,
    &#39;maxButtonCount&#39;=>8,
    &#39;cssFile&#39;=>false,
    &#39;htmlOptions&#39; =>array("class"=>"pagination"),
    &#39;selectedPageCssClass&#39;=>"active"
 )
 );
?>
</nav>

上面的視圖程式碼要注意以下幾個點

1.分頁必須在

裡

2，

1.分頁必須在

裡

2，

1.分頁必須在

裡

2， htmlOptions選項是必須的，他指定了yii產生的分頁div的class名稱，在這裡我們使用bootstrap的class名

3,selectedPageCssClass選項指定了目前選取頁的樣多，在這裡我們使用bootstrap的active

4.另外還要把cssFile設為false，不載入分頁css樣式檔

參考bootstrap官網提供的分頁程式碼，如下圖

最終實現的效果圖

🎜🎜🎜最終實現的效果圖🎜🎜🎜 ，希望對大家的學習有幫助，也希望大家多多支持PHP中文網。 🎜🎜更多yii使用bootstrap分頁樣式的實例相關文章請關注PHP中文網！ 🎜