前回書いたこれの続き( http://qiita.com/qwe001/items/a82054b45acaca164d7c )
実は私の案件ではCSSフレームワークはbootstrapじゃなくてUIKitなんです。まじかよ。
何がしたいか
laravel5の純正のページネーション機能では次のようなHTMLタグが生成されると思います。
View「index.blade.php」
<div>{{ $items -> appends(['disp_list' => $items -> perPage()]) -> render() }}</div>
↓
<div>
<ul class="pagination">
<li class="disabled"><span>«</span></li>
<li class="active"><span>1</span></li>
<li><a href="(サイトURL)?disp_list=5&page=2">2</a></li>
<li><a href="(サイトURL)?disp_list=5&page=2" rel="next">»</a></li>
</ul>
</div>
一方で、UIKitのページネーションのCSSは次のような記述が必要です。
<div>
<ul class="uk-pagination">
<li class="uk-disabled"><span><i class="uk-icon-angle-double-left"></i></span></li>
<li class="uk-active"><span>1</span></li>
<li><a href="(サイトURL)?disp_list=5&page=2">2</a></li>
<li><a href="(サイトURL)?disp_list=5&page=2"><i class="uk-icon-angle-double-right"></i></a></li>
</ul>
</div>
パッと見ただけでも各Class名に「uk-」が必要なんだなということがわかるかと思います。
jQueryのattrで変えようかな…とかも考えましたが、それは正解ではないなというのはわかっていたので、見つけた正解がこちら
結論:Landish Paginationを使う
インストール
ルートユーザーで実行してください
composer require landish/pagination
インストールが完了したら
composer update
実装
<div>{{ $items -> appends(['disp_list' => $items -> perPage()]) -> render() }}</div>
↓
<div>{!! (new Landish\Pagination\UIKit($items -> appends(['disp_list' => $items -> perPage()]))) -> render() !!}</div>
おわり
え、これだけ?はい。これだけです。なんて簡単。ありがとう海外の神々よ。改宗しなきゃ。