ASP.NET MVC 用のページ ナビゲーション ヘルパーはありますか?

Question

ページナビゲーション用のHTMLヘルパーはありますか。例えば。表示するレコードが 1000 件ある場合、前の 1 2 3 4 ... を表示したいと思います。etc 次に、フィルタリングされたコレクションの下にあるものをリンクします。

そこについて何か知っている人はいますか？

Answer 1

チェックアウト ASP.NET MVCによるページング、ページリストの逆襲およびページHTMLヘルパーを作成

Answer 2

JSON データからデータのテーブルを作成している場合は、YUI (Yahoo UI Library) DataTable コンポーネント (http://developer.yahoo.com/yui/datatable/）。ページングは​​非常にうまく機能し、最初にレコード セット全体を返してからクライアント側でそのすべてをページングするか、サーバーからページングされたセットを返すかを選択できます。

おそらくあなたのシナリオには当てはまらないかもしれませんが、それについて言及しておきたいと思います。

Answer 3

MVCサンプルアプリケーションの動的データにページンググリッドがあります、ただしグリッドは手でレンダリングされます。データは、Rob Coneryから来たPagedListを使用しています（Rob ConeryはScottGuから入手したと思います）。

MVCでページグリッドヘルパーがどのように見えるかについて考えてきました...

Answer 4

これまでページングのために行ったことは、Pagerコントロールの作成です。 ページングURL、更新用のHTML要素ID、ページ番号、ページサイズ、合計数を受け取ります。

ページングURLは、アクションがhtml文字列（データのレンダリングされたページ）を返すコントローラー/アクションの形式です

ページャーは、ページのjavascriptリンクのリストを追加します。これらのリンクは、ページングURLにアクセスするjQueryベースのajax関数を呼び出します。ページがクリックされるたびに、html要素の現在のコンテンツがajax呼び出しの結果に置き換えられます。 このようなもの：

public string Render()
{
    var buffer = new StringBuilder( 1000 );
    buffer.AppendLine( @"<ul class=""datatable_pager"">" )
        .AppendLine( "\t<li>Additional Pages:</li>" );
    int numberOfPages = TotalItemCount % PageSize == 0 ? TotalItemCount / PageSize : TotalItemCount / PageSize + 1;

    for( int i = 0; i < numberOfPages; i++ )
    {
        AppendPageLink( buffer, i );
    }

    buffer.AppendLine( "\t</ul>" );
    AppendPagingJS( buffer );

    return buffer.ToString( );
}

private void AppendPageLink( StringBuilder buffer, int i )
{
    buffer.Append( "\t\t<li><a href=\"" )
    .Append( PagingLink.Replace( "$PAGE<*>quot;, i.ToString( ) ) )
    .Append( "\">" )
    .Append( i.ToString( ) )
    .Append( "</a>" )
    .AppendLine( "\t\t</li>" );
}


private void AppendPagingJS( StringBuilder buffer )
{
    buffer.AppendLine( @"
        <script type=""text/javascript"">
        function page( page, size, updateElement )
        {
            $.post( '" + PagingUrl + @"',
                {
                    pageNumber: page, 
                    pageSize: size,
                },
                function(response) 
                {
                    $(""#"" + updateElement).html(response);
                },
                ""html""
            );
        }
        </script>" );
}

javascriptはページングURLに投稿するため、アクションは次のようにする必要があります。

int.TryParse（Request.Params [＆quot; pageNumber＆quot;]、out page）  int.TryParse（Request.Params [＆quot; pageSize＆quot;]、out size）

結果をデータアクセスコンポーネントで使用してデータページを取得し、htmlとしてレンダリングして返します。

お役に立てば幸いです。必要に応じて拡張できます。