문제

페이지 탐색을위한 HTML 도우미가 있습니까? 예를 들어. 표시 할 레코드가 1000 개라면 필터링 된 컬렉션 아래에 다음 링크를 표시하고 싶습니다.

누구든지 거기 밖에있는 것을 알고 있습니까?

다른 팁

JSON 데이터에서 데이터 테이블을 작성하는 경우 Yui (Yahoo UI 라이브러리) 데이터 가능한 구성 요소를 적극 권장합니다.http://developer.yahoo.com/yui/datatable/). 그것은 매우 잘 페이징을하고 당신은 전체 레코드 세트를 시작하기 위해 전체 레코드를 반환 한 다음 모든 클라이언트 쪽을 통해 페이징하거나 서버에서 페이징 세트를 반환 할 수있는 옵션이 있습니다.

아마도 당신의 시나리오에 맞지 않을 것이지만, 나는 그것을 언급 할 것이라고 생각했습니다.

나는 나의 페이징 그리드가있다 MVC 샘플 애플리케이션에 대한 동적 데이터, 그러나 그리드는 손으로 렌더링됩니다. 데이터는 Rob Conery에서 나온 PagedList를 사용하고 있습니다 (Scottgu에서 얻은 사람).

나는 PAGED- 그리드 도우미가 MVC의 모습에 대해 생각하고있다 ...

지금까지 페이징을 위해 수행 한 작업은 호출기 컨트롤을 만드는 것입니다. 업데이트, 페이지 번호, 페이지 크기 및 총 카운트를 위해 페이징 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$", 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 [ "pagenumber"], Out Page) int.ryparse (request.params [ "pagesize"], out size)))

데이터 액세스 구성 요소와 함께 결과를 사용하여 데이터 페이지를 잡고 HTML로 렌더링하고 반환하십시오.

도움이되기를 바랍니다. 필요한 경우 확장 할 수 있습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top