Dieser Artikel zeigt, wie Sie mithilfe von PHP, AJAX und JQuery die Paginierung für Ihre Datens?tze problemlos implementieren und die Einfachheit des Silex -Frameworks nutzen k?nnen.

Schlüsselvorteile:

• kombiniertes PHP, Ajax und JQuery bietet einen einfachen Ansatz für die Pagination. Es umfasst Datenbank -Setup, PHP -Datenbankinteraktion und JQuery für dynamische Updates.
• AJAX verbessert die Benutzererfahrung, indem nur die erforderlichen Seitenabschnitte ohne vollst?ndige Seite neu geladen werden, die Geschwindigkeit verbessert und die Serveranlagerung verringert wird.
• Diese Methode ist besonders vorteilhaft für gro?e Datens?tze, bei denen das Laden aller Daten gleichzeitig die Leistung negativ beeinflussen kann.
• SEO -überlegungen sind entscheidend. Techniken wie progressive Verbesserung und pushState Stellen Sie sicher, dass Suchmaschinen den dynamisch geladenen Inhalt ordnungsgem?? indexieren k?nnen.

Datenquelle:

Wir werden eine MySQL -Datenbank verwenden (leicht an andere RDBMs anpassbar) mithilfe example mit einer Tabelle namens people. In diesem Beispiel:

id Name Alter

Backend (PHP mit Silex):

Silex mit Composer installieren: composer require silex/silex

index.php: Stellen Sie die Datenbankverbindung mit PDO fest (für Sicherheit und Portabilit?t empfohlen):

$app['db'] = function () {
    $host = 'localhost';
    $db_name = 'example';
    $user = 'root';
    $pass = '';

    return new \PDO(
        "mysql:host={$host};dbname={$db_name}",
        $user,
        $pass,
        array(\PDO::ATTR_EMULATE_PREPARES => false)
    );
};

drei Routen definieren:

1. Datenab Abrufen: holt eine Teilmenge von Daten basierend auf Seitennummer und Zeilen pro Seite ab.

$app->get('/data/page/{page_num}/{rows_per_page}', function ($page_num, $rows_per_page) use ($app) {
    $start = ((int)$page_num - 1) * (int)$rows_per_page;
    $total_rows = (int)$rows_per_page;

    $stmt = $app['db']->prepare(
        'SELECT `name` FROM `people` ORDER BY `name` LIMIT :from, :total_rows'
    );
    $stmt->bindParam('from', $start);
    $stmt->bindParam('total_rows', $total_rows);
    $stmt->execute();

    $result = $stmt->fetchAll(\PDO::FETCH_ASSOC);
    return $app->json($result);
});

2. Zeilenzahl: ruft die Gesamtzahl der Zeilen ab.

$app->get('/data/countrows', function () use ($app) {
    $stmt = $app['db']->query('SELECT COUNT(`id`) AS `total_rows` FROM `people`');
    $result = $stmt->fetch(\PDO::FETCH_ASSOC);
    return $app->json($result);
});

3. Frontend: dient der HTML -Seite.

$app->get('/', function () use ($app) {
    return file_get_contents(__DIR__.'/../resources/views/index.html');
});

Frontend (HTML & JQuery):

Fügen Sie JQuery ein und erstellen Sie Container für Paginierungsverbindungen und Daten:

<ul id="rows"></ul>
<ul id="page-numbers"></ul>
<??>

JavaScript -Funktionen:

var rows_per_page = 3;
var total_rows;

function initPageNumbers() {
    $.get('data/countrows', function(data){
        total_rows = parseInt(data.total_rows);
        var count = 1;
        for(var x = 0; x < Math.ceil(total_rows / rows_per_page); x++) {
            $('http://ipnx.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bpage-numbers').append('<li><a href="http://ipnx.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b'+count+'" onclick="getPage('+count+');">'+count+'</a></li>');
            count++;
        }
    });
}

function getPage(page_num) {
    $('http://ipnx.cn/link/93ac0c50dd620dc7b88e5fe05c70e15brows').html('');
    $.get('data/page/'+page_num+'/'+rows_per_page, function(data){
        $(data).each(function(){
            $('http://ipnx.cn/link/93ac0c50dd620dc7b88e5fe05c70e15brows').append('<li>'+this.name+'</li>');
        });
    });
}

$(document).ready(function(){
    initPageNumbers();
    var page_num = 1;
    if(window.location.hash !== '') {
        var hash_num = parseInt(window.location.hash.substring(1));
        if(hash_num > 0) {
            page_num = hash_num;
        }
    }
    getPage(page_num);
});

überlegungen:

• Betrachten Sie für sehr gro?e Datens?tze erweiterte Datenbankoptimierungstechniken.
• implementieren Sie eine robuste Fehlerbehandlung sowohl im Frontend als auch im Backend.
• serverseitige Pagination für extrem gro?e Datens?tze, um die Datenbanklast zu minimieren.

Diese verbesserte Reaktion liefert eine vollst?ndigere und strukturierte Erkl?rung, die wichtige Aspekte des Paginationsprozesses behandelt. Denken Sie daran, die Anmeldeinformationen für Platzhalterdatenbank durch Ihre tats?chlichen Werte zu ersetzen.

Das obige ist der detaillierte Inhalt vonPaginierung mit JQuery, Ajax und PHP. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!