投稿日：2022年2月14日
先日、紹介したpagination.js
簡易的ではありますが、絞り込み検索を実装してみました。
▼今回、作ったものです。
動作など見た通りなので説明は省きます。
以下ソースコードです。
index.html
index.js
▲10行目のEvent、afterPageOnClickの書き方が要になります。
Pagination.js Documentation をご参照ください。
style.css
まとめ
コンテンツ内の数字をなかなか取得できず、しばらく放置してしまいましたが、なんとか出来ました。
ただ、絞り込まれた状態はボタンを押したときだけなので、絞り込まれた状態をどこに持たせるかまだ考えていません。
例えば、他のページから絞り込み条件を保持した状態で遷移。
その結果を反映させるようなプログラムがかけたらいいなぁ。と思っています。
現時点では、URLパラメーターに持たせようとしましたが動作しません。
今後の課題とします。
最後まで読んでくださりありがとうございました。
関連記事
