Frage

Gibt es irgendwelche HTML-Helfer für die Seitennavigation. z.B. wenn ich 1000 Datensätze angezeigt werden, möchte ich die vorherigen 1 2 3 4 anzuzeigen ... etc Weiter Link Sachen unter der gefilterten Sammlung.

Wer weiß von nichts da draußen?

Andere Tipps

Wenn Sie eine Tabelle mit Daten von JSON-Daten zu schaffen, ich habe die YUI (Yahoo UI Library) empfehlen Datatable Komponente ( http://developer.yahoo.com/yui/datatable/ ). Es tut Paging sehr gut und Sie haben die Möglichkeit, den gesamten Datensatz Rückkehr gesetzt, mit zu beginnen und dann die durch alle clientseitige Paging oder einen ausgelagerten Satz vom Server zurück.

wird wahrscheinlich nicht passen Ihr Szenario, sondern nur dachte ich, es erwähnen würde.

Ich habe ein Paging-Gitter in meinem Dynamic Data für MVC-Beispielanwendung , aber das Gitter wird von Hand gemacht wird. Die Daten werden über PagedList, die von Rob Conery kam (die wiederum bekam ich denke, es ist von ScottGu).

Ich habe darüber nachgedacht, was ein ausgelagerten-Grid-Helfer wie für MVC aussehen könnte ...

Was ich für das Paging bisher getan ist, ein Pager-Steuerelement erstellen, Es dauert ein Paging-url, html-Element-ID für die Aktualisierung, die Seitenzahl, Seitengröße und Gesamtzählung.

Die Paging-URL ist von der Form Controller / Aktion, wo die Aktion gibt eine HTML-Zeichenfolge (die gerenderte Seite von Daten)

Der Pager hängt eine Liste von Javascript-Links für die Seiten. Diese Verbindungen rufen eine jQuery basierte Ajax-Funktion, die die Paging-URL trifft. Jede Seite klicken ersetzt den aktuellen Inhalt des HTML-Elements mit den Ergebnissen des Ajax-Aufrufs. So etwas wie folgt aus:

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>" );
}

Die JavaScript-Beiträge an die Paging-URL, so dass die Aktion muß dann etwas tun:

int.TryParse (Request.Params [ "Seitennummer"], out-Seite)  int.TryParse (Request.Params [ "pagesize"], aus Größe))

und verwenden Sie die Ergebnisse mit Ihren Datenzugriffskomponenten der Datenseite zu packen, macht es als HTML und gibt es zurück.

Ich hoffe, das hilft, kann ich auf sie erweitern, wenn nötig.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top