2016-07-19 10 views
0

HTMLtableのレコードを10レコードだけ表示するにはどうすればいいですか?また、10ページを超えると次のページのリンクが表示されます。例えば"1、2、3 .."そして、YouTubeがそれをどのように表示するかのような最大7つのリンクを制限します(下の画像を参照)?ところで、私はASP.Net MVCを使っています。テーブル内のレコード数をページに分割 - ASP.Net MVCブートストラップ

<table id="userTbl" onclick="getTblRec('userTbl,'userBody','0')" class="table-scroll table-striped bootgrid-table"> 
    <thead> 
     <tr> 
      <th class="hidden"> 
       @Html.DisplayNameFor(model => model.USR_ID) 
      </th> 
      <th class="hidden"> 
       @Html.DisplayNameFor(model => model.USR_FNAME) 
      </th> 
     </tr> 
    </thead> 
    <tbody id="userBody"> 
     @foreach (var item in Model) 
     { 
      <tr> 
       <td id="userId" class="hidden"> 
        @Html.DisplayFor(modelItem => item.USR_ID) 
       </td> 
       <td> 
        @Html.DisplayFor(modelItem => item.USR_FNAME) 
       </td> 
       <td> 
      </tr> 
     } 
    </tbody> 
</table> 

YouTubeのサンプルPIC:

enter image description here

+0

どうすればよいですか?これはJavascriptで行う必要がありますか?またはCSSですか?またはmvc? –

答えて

1

ページネーション、サーバーとクライアント側の実装の2つの方法があります。まず、サーバーの実装では、ページのオプションと共にサーバーのページに表示される項目のセットのみをロードします。クライアント側のページネーション、アイテムのセット全体をロードし、テーブルやその他のコントロールのサポートをページネーションに提供します。どちらのオプションにも長所と短所があります。これらのリンクは、トピック、link1link2から始める必要があります。

+0

それはその言葉のページネーションです。リンクのおかげでありがとう!私は私の自由な時間にそれをチェックするつもりだ:) –

1

ASP.NET MVCを使用しているので、ページングなどのシナリオではWebGridという名前のヘルパーがビルドされています。これは使い方が簡単で、ほとんどの機能が必要な場合があります。

この初心者レベルのウォークスルーもご覧ください。 WebGrid in asp.net mvc (By Sheo Narayan)

1

レコードはこのリンクで10以上すなわちPaging

を持っているか、あなたもこのnugetをインストールすることができ、あなたの希望のスタイルがこれを設計することができるであろう場合、ページングのための部分的なビューを作成し、その部分図を呼び出しますナゲットのリンクですNuget Packege

関連する問題