jQuery implementiert den Tabellen-Paging-Effekt

<Stil>
    .pager {
        Schriftgröße: 18px;
    }
 
    .pagerTotal {
        Schriftgröße: 18px;
        Höhe: 36px;
        Zeilenhöhe: 36px;
        Rand links: 2px;
    }
 
    .pager_a {
        Anzeige: Block;
        Breite: 36px;
        Höhe: 36px;
        Zeilenhöhe: 36px;
        schweben: links;
        Textausrichtung: zentriert;
        Rand: 1px tief schwarz;
        Farbe: Schwarz;
        Rand links: 2px;
        Cursor: Zeiger;
    }
 
    .pager_a_red {
        Anzeige: Block;
        Breite: 36px;
        Höhe: 36px;
        Zeilenhöhe: 36px;
        schweben: links;
        Textausrichtung: zentriert;
        Rand: 1px durchgehend rot;
        Farbe: rot;
        Schriftstärke: fett;
        Rand links: 2px;
        Cursor: Zeiger;
    }
</Stil>

<span class="pager"></span>&nbsp;<span class="pagerTotal"></span>
<Tabelle>
<tr>
    <th>Marke</th>
    <th>Shop</th>
    <th>Lager</th>
</tr>
<tbody id='tbody'></tbody>
</Tabelle>
<span class="pager"></span>&nbsp;<span class="pagerTotal"></span>

<Skript>
    // Initialisiere $(function () {
        Berichtsseite(1);
    });
    //Bericht laden - Paging-Funktion ReportPage(pageIndex) {
        var index = pageIndex; //Seitennummer var size = 500; //Anzahl der Einträge pro Seite var startDate = $("#startDate").val();
 
        $("tbody").leer();
        $.ajax({
            asynchron: falsch,
            Typ: "GET",
            Daten: {
                "startDate": Startdatum,
                "pageIndex": Index,
                "pageSize": Größe,
            },
            URL: "/Controller/GetData",
            Datentyp: "json",
            Erfolg: Funktion (Anfrage) {
                //Rechtschreibtabelle$.each(request.data, function (i, field) {
                    var html = "";               
                    html += "<tr>";
                    html += "<td>" + Feld.Marke+ "</td>";        
                    html += "<td>" + field.Shop+ "</td>";
                    html += "<td>" + Feld.Lager + "</td>";
                    html += "</tr>";
                    $("#tbody").anhängen(html);
                });           
                Seiten (Seitenindex, Anfrage.alleSeite, Anfrage.gesamt);//Seitennummerierung generieren},
        });
    }
 
    //Paging-Schaltflächenfunktion Pages(pageIndex, pageCount, pageTotal) {
        $(".pagerTotal").html("&nbsp;&nbsp;Gesamt: <font color='red'>" + pageTotal + "</font>&nbsp;Daten!");
        $(".pager").leer();
        var Seite = "";
        für (var i = 0; i < Seitenanzahl; i++) {
            wenn ((i + 1) == Seitenindex) {
                Seite + = "<span class='pager_a_red'>" + (i + 1) + "</span>";
            }
            anders {
                Seite += "<span class='pager_a' onclick='ReportPage(" + (i + 1) + ")'>" + (i + 1) + "</span>";
            }
        }
        $(".pager").anhängen(Seite);
    }
</Skript>

öffentliches ActionResult GetData(Zeichenfolge Startdatum, int Seitenindex, int Seitengröße)
        {
                Zeichenfolge json = Zeichenfolge.Leer;          
                wenn (!string.IsNullOrEmpty(startDate))
                {
                    int-gesamt = 0;
                    int alle Seiten = 0;
                    DataTable dt = bll.GetData(Startdatum, Seitenindex, Seitengröße, Gesamtwert, Alle Seiten);
                    wenn (dt != null und dt.Zeilen.Anzahl > 1)
                    {
                        json = JsonConvert.SerializeObject(neu
                        {
                            total = total, //Gesamtzahl der Datensätze allPage = allPage, //Gesamtzahl der Seiten data = dt, //Daten nach der Paginierung });
                    }
                }        
                Inhalt zurückgeben (json);
        }

öffentliche DataTable GetDate(Zeichenfolge Startdatum, int Seitenindex, int Seitengröße, out int Gesamt, out int alle Seiten)
{
    //Gesamtzahl der Daten und Gesamtzahl der Seiten berechnen string sqlCount = "select count(*) from table where date='"+startDate+"'"; //Gesamtzahl der Daten abrufen total = int.Parse(SqlHelper.GetSingel(sqlCount ).ToString()); //Gesamtzahl der Datenzeilen allPage = total / pageSize; //Gesamtzahl der Seiten = Gesamtzahl der Datenzeilen / Anzahl der Zeilen pro Seite allPage += total % pageSize == 0 ? 0 : 1; //Weniger als eine Seite wird auch als eine Seite gezählt //Paging-Daten abrufen string sql = "";
    sql = "DECLARE @PageIndex INT;";
    sql = "DECLARE @PageSize INT;";
    sql = "SET @PageIndex=" + Seitenindex;
    sql = "SET @PageSize=" + Seitengröße;
 
    sql += " SELECT * FROM (SELECT ROW_NUMBER() OVER(ORDER BY ID desc) rownum, * FROM table where date ='"+ startDate +"')a";
    sql += " WO rownum > @PageSize * (@PageIndex - 1) UND rownum <= @PageSize * @PageIndex";
    sql += "Sortieren nach ID desc";
 
    DataTable dt = SqlHelper.GetDate(sql);//Paging-Daten return dt;
}