Q&A
回答が付いた質問の編集は慎重に行ってください。質問について回答にて指摘があった場合は元のものを削除せずに「追記」してください。
ページング機能をつけるにあたって、下記のライブラリを使用しました。
https://datatables.net/examples/basic_init/alt_pagination.html
しかし、ページングのデザインを以下のように変更したいのですが、どのようにすればよいでしょうか。
また、表示される位置を表の上部に変更したいです。
実装したい機能はは以下の通りです。
<< < 1 2 3 … > >>
<<:最初のページへ遷移
<:1つ前のページへ遷移
数値:指定のページへ遷移
:1つ後ろのページへ遷移
最終ページへ遷移
ご指摘ありがとうございます。承知しました。回答で指摘があったわけではなく、修正前の質問に付随する形だったので修正しました。おっしゃるように追記で行うべきでした
https://teratail.com/questions/history-questions/76807 ここから元文書を参照できるので、編集されることをお勧めします。
回答2件
0
既存のライブラリ使った方が早いと思います。
DataTables | Table plug-in for jQuery
Tabulator
スクラッチするならテーブルの内容をオブジェクトなどで保持しておいて、イベントを拾い、対応するビューになるように再描画する、というフローになるかと思います。
質問の変更を受けて追記
The language strings of 'First', 'Previous' etc can be optionally through the internationalisation options of DataTables;
DataTables example - Alternative pagination
the dom initialisation parameter which can be set to indicate where you wish particular features to appear in the DOM.
DataTables example - DOM positioning
まず、ドキュメントを読んでから質問してください。
投稿2017/05/19 02:07
編集2017/05/19 06:11
総合スコア37426
ご回答ありがとうございます。
英語が苦手なため、敬遠していましたが、やはり使用したほうが早いみたいですね。
これを見ると最初/最終ページへの遷移がないのですが、追加実装は出来ますでしょうか。
また、大変お手数だとは思いますが、追加実装できる場合はどのような記述を行えばよいでしょうか？
失礼しました、調べると教えていただいたライブラリはMITライセンスのため、他のライブラリを使用します。
業務で使用するかもしれない機能の練習で行っているため、使用に条件があるものは避けたいです。
業務利用だとしても、MITの条件をクリアできないなんてことはほぼありえないと思いますよ？
もう一度確認されてみては？以下がわかりやすいです。
http://wisdommingle.com/mit-license/
ご回答ありがとうございます。
以下は「MITライセンスの全文」の意訳 で、
著作権表示とライセンスの全文を掲載しなければと思ったのですが、
認識が誤ってますか？
下記の条件を受け入れていただけるのであれば、誰でも自由に無料で、このソフトウェアをつかっていただくことができます。
このソフトウェアをコピーしてつかったり、配布したり、変更を加えたり、変更を加えたものを配布したり、商用利用したり、有料で販売したり、なんにでも自由につかってください。
このソフトウェアの著作権表示（「Copyright (c) 年 作者名」）と、このライセンスの全文（英語の文章）を、ソースコードのなかや、ソースコードに同梱したライセンス表示用の別ファイルなどに掲載してください。
このソフトウェアにはなんの保証もついていません。たとえ、このソフトウェアを利用したことでなにか問題が起こったとしても、作者はなんの責任も負いません。
"掲載"といっても（JavaScriptのライブラリの場合は）ソースコード内に記載があれば十分といったかんじです。というか、通常はダウンロードしたソースコードファイル内に記載があるので、それを消さなければ良いだけの話です。
ちなみにMITがNGならjQueryも使えませんよ。
以下がわかりやすいですよ。
https://oshiete.goo.ne.jp/qa/5672252.html
> これを見ると最初/最終ページへの遷移がない
https://datatables.net/examples/basic_init/alt_pagination.html
h_daidoさん
ライブラリを使用する際にダウンロードしたjsをいじらない場合は、必要ないのですね。
わかりやすい、ご解説とサイトのご紹介ありがとうございました。
Lhankor_Mhyさん
ありがとうございます。
ライブラリを使用するに当たって、不明な点が出たので質問を編集いたします。
0
ページングば以下最低２つ指定します
- 1ページに表示するデータ個数
- ページャーに表示するページ個数
その上で、データからデータ個数を調べておきます
最後のページはデータ個数/ページあたりデータ数して
切り上げた数字になります。
28個のデータを1ページあたり10個表示するなら28/10を切り上げて3が
最終ページです
投稿2017/05/19 02:05
総合スコア117691
今回のソースでダメな点は、１ページあたりの表示数である10を
プログラム中に数値として埋め込んでいるところですね
これでは汎用性もなくきちんとした処理もできません
オープンソースのライブラリを使用してみます。
あなたの回答
tips
プレビュー
