まず、シンプルできちんとしたパジネーターであるBootstrap-Paginatorを紹介しましょう。参照できます：Bootstrap Paginator。 Paginator Pagingプラグインの使用に関する詳細な説明。この記事は学習に使用されます。
効果スクリーンショット：
Githubの公式ダウンロードアドレス：https：//github.com/lyonlai/bootstrap-paginator
このページングツールに基づいてJSPページングディスプレイの実装プロセスを詳細に紹介しましょう（注：元のWebページと比較して、私は多くの不要なコンテンツを非表示にしました。この例は、ページングディスプレイの実装にのみ焦点を当てています）
1.なぜページングを表示する必要があるのですか？
このブログ投稿では、それを徹底的に説明しています：ページングテクノロジーの原則とページングの重要性と方法（i）
2。JSPページパーツ、ここでは、JSPページのJDBCを使用してSQLSERVER2005データベースに直接接続してデータを照会します（実際の実装では、JSPページで複雑なビジネスロジックをカプセル化することはお勧めしません。
コードは次のとおりです。
<％@ページインポート= "paginationexample。*"％> <％@ページインポート= "java.util。プライベート静的最終int pagesize = 20; //ページごとに表示されているレコードの数を設定します（現在、ページごとに表示されている20のレコード）％> <％request.setcharacterencoding（ "utf-8"）; //クライアントが送信したコンテンツを、UTF-8エンコード応答としてサーブレットに設定します。SetchAracterenCoding（ "UTF-8"） // utf-8エンコードResponse.setContentType（ "text/html; charset = utf-8"）として、クライアントに送信されたコンテンツをクライアントに設定します。 //ブラウザに、UTF-8形式の文字列pagenoStr = request.getParameter（ "pagenostr"）でコンテンツを解析するように通知します。 //クライアントが表示するページ数を受信しますint pageno = 1; //表示されるページ数int totalpages = 1; //ページの総数// pageno if（pagenostr！= null &&！pagenostr.equals（ ""））{try {pageno = integer.parseint（pagenostr）; if（pageno <1）{// pagenoが1未満の場合、最初のページはデフォルトでpageno = 1; }} catch（numberformatexception e）{//取得したpageno（現在のページ数）が違法である場合、最初のページはデフォルトでpageno = 1; }} else {// pagenoが取得されていない他のケースは、デフォルトでpageno = 1; } /* ========================================================================== ========================================================================== *//*記録が指定された数字（Pagesize）でページングされた後、データベース内のページの総数を取得します*/ connection totalconn = null;ステートメントtotalstmt = null; resultet totalrs = null; try {totalconn = dbutil.getConnection（）; // sqlステートメント文字列sqlgettotalpages = "alldataからcount（*）を選択"; //レコードの総数を取得しますtotalstmt = totalconn.createStatement（）; totalrs = totalstmt.executequery（sqlgettotalpages）; totalrs.next（）; int countresult = totalrs.getint（1）; //ページの合計数を取得ottolpages = countresult％pagesize == 0？ countresult / pagesize：（int）（countresult / pagesize） + 1; } catch（sqlexception e）{system.out.println（ "履歴クエリでエラーが発生し、操作は完了しませんでした！"）; e.printstacktrace（）; }最後に{dbutil.close（totalrs）; dbutil.close（totalstmt）; dbutil.close（totalconn）; } /*ページの数がページの総数よりも大きい場合、最後のページはデフォルトで表示されます* / if（pageno> totalpages）{pageno = totalpages; } /*データベースの現在のページに表示される観測レコードを取得し、リストを使用してレコードを保存します* / list <レコード>レコード= new arrayList <condion>（）;接続conn = null; predtatement pstmt = null;結果rs = null; int startindex =（pageno -1） * pagesize + 1; int endindex = pageno * pagesize; try {conn = dbutil.getConnection（）; string sql = "select * from（select row_number（）over（data_taizhan_num、data_date asc）として 'num'、 * alldataから * select row_number（）over（alldataから *）" + startindex + "と" + endindex; pstmt = conn.preparestatement（sql）; rs = pstmt.executequery（）; while（rs.next（））{//各レコードのデータを取り出して、それをレコードオブジェクトレコードr = new Record（）にカプセル化します。 R.Settaizhan_Num（rs.getString（2））; R.SetDate（rs.GetTimestamp（3））; R.Settem（rs.getString（4））; R.SETHUM（Rs.getString（5））; R.Setpa（rs.getString（6））; R.Setrain（rs.getString（7））; R.SetWin_Dir（Rs.getString（8））; R.SetWin_sp（rs.getString（9））; Records.Add（r）; //カプセル化されたレコードオブジェクトをリストコンテナに入れます}} catch（sqlexception e）{system.out.println（ "クエリエラー、操作が完了していない！"）; e.printstacktrace（）; }最後に{dbutil.close（rs）; dbutil.close（pstmt）; dbutil.close（conn）; } system.out.println（totalpages）; System.out.println（pageno）;/* ================================================================================================= ％> < charset = utf-8 "> <meta http-equiv =" x-ua-compatible "content =" ie = edge "> <％ - ieで最新のレンダリングモードを実行します - ％> <メタ名=" viewport "content =" width = device-width、iniveryscale = 1 "> <％<％ rel = "styleSheet" href = "css/bootstrap.css"> <link rel = "styleSheet" href = "css/recordsearchresult.css"> <スクリプトタイプ= "text/javascript" src = "js/jquery-1.12.3.min.js" src = "js/bootstrap.min.js"> </script> <script = "text/javascript" src = "js/bootstrap-paginator.min.js"> </script> <title>-</title> </head> <body> <div> Records.size（）== 0）{out.println（ "<tr> <td> <h4> <strong>要件を満たすレコードなし、検索条件を変更しようとしてみませんか</strong> </h4> </td> </tr>"）; } else {％> <tr> <td> <h4> <strong>観測ステーション</strong> </h4> </td> <％レコードr = Records.get（0）; if（r.gettem（）！= null）{out.println（ "<td> <h4> <strong>温度（℃）</strong> </h4> </td>"）; } if（r.gethum（）！= null）{out.println（ "<td> <h4> <strong>湿度（％）</strong> </h4> </td>"）; } if（r.getpa（）！= null）{out.println（ "<td> <h4> <strong> pressure（hpa）</strong> </h4> </td>"）; } if（r.getrain（）！= null）{out.println（ "<td> <h4> <strong>降雨（mm）</strong> </h4> </td>"）; } if（r.getwin_dir（）！= null）{out.println（ "<td> <h4> <strong>風向（°）</strong> </h4> </td>"）; } if（r.getwin_sp（）！= null）{out.println（ "<td> <h4> <strong>風速（m/s）</strong> </h4> </td>"）; }％> <td> <h4> <strong>観測時間</strong> </h4> </td> </tr> <％}％> <％if（record！= null && records.size（）！= 0）{for（Record R：Records）{％> <tr> <td> <％if（） null）{out.println（ "<td>" + r.gettem（） + "</td>"）; } if（r.gethum（）！= null）{out.println（ "<td>" + r.gethum（） + "</td>"）; } if（r.getpa（）！= null）{out.println（ "<td>" + r.getpa（） + "</td>"）; } if（r.getrain（）！= null）{out.println（ "<td>" + r.getrain（） + "</td>"）; } if（r.getwin_dir（）！= null）{out.println（ "<td>" + r.getwin_dir（） + "</td>"）; } if（r.getwin_sp（）！= null）{out.println（ "<td>" + r.getwin_sp（） + "</td>"）; }％> <td> <％= r.getdate（）％> </td> </tr> <％}％> </table> <！ - ページネーションディスプレイdiv-> <div align = "center"> <ul id = "paginator"> </ul> </div> </form> <％}％> </div> </div> <スクリプトタイプ= '> bootstrapmajorversion：3、// bootstrapバージョンサイズ：「通常」、itemtexts：function（type、page、current）{switch（type）{case "first"：return "home"; case "prev"：return "<i class = 'fa fa-caret-left'> </i>前のページ";ケース "next"：return "次のページ<i class = 'fa fa-caret-right'> </i>";ケース「最後」：「最後のページ」を返します。ケース「ページ」：ページを返します。 }}、tooltiptitles：function（type、page、current）{switch（type）{case "first"：return "homepage";ケース "prev"：「前のページ」を返します。ケース「次へ」：「次のページ」を返します。ケース「最後」：「最後のページ」を返します。ケース「ページ」：「スレッド」 +ページ +「ページ」を返します。 }}、pageurl：function（type、page、current）{return "showinfosearchresult.jsp？pagenostr ="+page; //選択したページにスキップ}、numberofpages：6、//「ページ」を表示するオプションの数は現在ページです：<％= pageno％>、//現在</script> </body> </html>3。この例で使用されているレコードとdbutilクラスについて：
レコードクラスは、データをカプセル化し、取得/セットのみを提供する通常のJavaクラスです。そのプロパティは、データベーステーブルに1つずつ含まれるフィールドに対応しています。コードは次のとおりです。
パッケージpaginationexample; import java.sql。*;/***気象データ情報をカプセル化* @author zhong**/public class record {private string taizhan_num; //ステーション名private string tem; //温度プライベートストリングハム; //湿度プライベートストリングPA; //プライベートストリングレイン。 //降雨プライベートストリングwin_dir; //風力方向private string win_sp; //風速プライベートタイムスタンプの日付。 //観測日（元の形式） /***観測記録を生成したステーションの名前を取得します。 * @returnステーション名*/ public string gettaizhan_num（）{return taizhan_num; } /***観測記録を生成するステーションの名前を設定します。 * @param taizhan_numセットするステーション名*/ public void setaizhan_num（string taizhan_num）{this.taizhan_num = taizhan_num; } /***温度を取得します。 * @return温度値*/ public string getTem（）{return tem; } /***温度を設定します。 * @param temセットする温度値*/ public void setem（string tem）{this.tem = tem; } /***湿度を取得します。 * @return湿度価値*/ public string gethum（）{return hum; } /***湿度を設定します。 * @param hum to set*/ public void sethum（string hum）{this.hum = hum; } /***圧力を取得します。 * @return pressure値*/ public string getpa（）{return pa; } /***圧力を設定します。 * @param pa set*/ public void setpa（string pa）{this.pa = pa; } /***降雨を取得します。 * @return降雨値 */ public string getrain（）{return Rain; } /***降雨を設定します。 * @param Rainは雨の価値があります} /***風の方向を取得します。 * @return Wind Direction Value */ public String getwin_dir（）{return win_dir; } /***風向を設定します。 * @param win_dirは風の方向値を設定するものです} /***風速を取得します。 * @return風速値 */ public string getwin_sp（）{return win_sp; } /***風向を設定します。 * @param win_spセットする風の方向値*/ public void setwin_sp（string win_sp）{this.win_sp = win_sp; } /***観測日を取得します。 * @return監視日*/ publicタイムスタンプgetdate（）{return date; } /***観測日を設定します。 * @param日付観測日VALUE*/ public void setDate（TimestAmp Date）{this.date = date; }}対応するAlldataテーブルのスクリーンショット：
dbutilクラスは、次のコードを使用して、データベース関連の接続、ステートメントなどを提供するデータベースツールクラスです。
パッケージpaginationexample; Import java.sql。 *; import org.apache.tomcat.jdbc.pool.datasource; Import org.apache.tomcat.jdbc.pool.poolproperties; DS; static {// tomcat jdbcプール（接続プール）poolproperties p = new poolproperties（）を構成する; P.Seturl（ "JDBC：sqlserver：// localhost：1433; databasename = weather"）; //接続されたURL P.SetDriverClassName（ "com.microsoft.sqlserver.jdbc.sqlserverdriver"）; //データベースドライバーP.SetUsername（ "sa"）; //リモート接続のユーザー名P.SetPassWord（ "2003niandieyichangxue"）; //パスワードP.SetJMXENABLED（true）; p.settesthileidle（false）; P.Settestonborrow（True）; P.SetValidationQuery（ "Select 1"）; P.Settestonreturn（false）; P.SetValidationInterval（30000）; P.SettimeBetInevictionRunsMillis（30000）; P.SetMaxactive（100）; P.SetInitialSize（10）; P.SetMaxWait（10000）; P.SetRemoveaBandonedTimeout（60）; P.SetMineVictableIdletimemillis（30000）; P.SetMinidle（10）; P.SetLogaBanded（true）; P.SetRemoveaBandoned（true）; P.SetJDBCINTERCEPTORS（ "org.apache.tomcat.jdbc.pool.interceptor.connectionState;"+ "org.apache.tomcat.jdbc.interceptor.statementfinalizer"）; ds = new DataSource（）; ds.SetPoolProperties（P）; } private dbutil（）{} /***データベース接続（接続）を取得します。 * @returnデータベース接続 */ public static Connection getConnection（）{connection conn = null; try {conn = ds.getConnection（）; } catch（sqlexception e）{e.printstacktrace（）; } return conn; } /***着信接続を閉じます。 * @param conn Connection to閉じる */ public static void close（connection conn）{try {if（conn！= null）{conn.close（）; conn = null; }} catch（sqlexception e）{e.printstacktrace（）; }} /***着信声明を閉じます。 * @param stmtステートメントは閉じますstmt = null; }} catch（sqlexception e）{e.printstacktrace（）; }} /***着信結果を閉じます。 * @param rs results closhted rs = null; }} catch（sqlexception e）{e.printstacktrace（）; }}}4。補足注：
①：SQLServerがページングを実装する場合、row_Number（）関数を使用して、行番号を個別に記録する列を生成して、対応する行数間隔の後続のページングを容易にする必要があります。例：
前に列があり、行番号のフィールド名にnumという名前の行番号があることがわかりました。
（テーブル内の主要なキーIDが自動的に増加した数字である場合、IDを使用してセグメントのレコードを取得することもできますが、前提は、IDが継続的かつ自動的に増加する必要があることです）
row_number（）関数によるページングの実装の詳細については、row_numberページングを使用するSQL Serverの実装方法を参照してください。
②：MySQLページネーションの実装がはるかに簡単で、Limitキーワードを使用するだけです。例：
ID ASC制限3でtable1の順序から *を選択します2、2は、Table1のデータをID値（ASC ORDER）で並べ替えた後、3行目から始まり、次の2行のレコード（つまり、4行目と5列目のレコード）を取得することを意味します。
③：Bootstrap-Paginatorの特定の使用については、公式ドキュメント（減圧後にドキュメントフォルダーにある）を参照できます。公式文書は非常によく書かれており、シンプルで理解しやすいです。
Bootstrap V3バージョンを使用する場合、<ul>タグを使用してBootstrap-Paginatorを表示し、構成項目で使用されるBootstrapのバージョンを示してください（JSPの例のページ作成方法を参照）。
（ブートストラップV2バージョンは、サンプルドキュメントの<div>タグを使用して直接使用できます）
④：一般的に使用されるページネーションに使用される式：表示されるページの数がnであり、各ページにMピースが表示され、取得するデータの開始位置（つまり、n-1）*m+1、およびend position（endindex）は次のとおりです。
それでも詳細に勉強したい場合は、ここをクリックして3つのエキサイティングなトピックを勉強して添付できます。
ブートストラップ学習チュートリアル
ブートストラップ実用的なチュートリアル
ブートストラッププラグインの使用チュートリアル
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。