[FRAGE] Dynamische AJAX-Pagination erstellen

[RoyRobsen]

Moin,

ich bin noch ziemlich grün was AJAX/Javascript/jQuery betrifft, aber ich möchte diese Lücke langsam mal schließen, damit ich das in meinen Projekten einsetzen kann.

Das Ziel: Eine Suchseite, das Ergebnisse aus einer MySQL-Datenbank liefert. Angezeigt werden sollen 9 Ergebnisse pro Seite, wobei die Seiten über die Pagination, am Ende der Seite gewählt werden können. Diese Pagination soll allerdings die aktuelle Seite +-2 Seiten anzeigen
(Bsp.: First | ... | 4 | 5 | 6 | 7 | 8 | ... | Last)

siehe als Beispiel: Titel
(zum Testen bitte "vfl" in die Suche eingeben)

Das Problem: Ich weiß nicht wie ich die Pagination dynamisch erzeugen soll. Ich haben den Code zum Erstellen bereits mit in die Datei fetch_pages.php gepackt, aber dann funktioniert der AJAX-Code nicht mehr.

Der Code

Javascript in der Suchseite

$(document).ready(function() {
    $("#results").load("fetch_pages.php", {'page':0, 'q':'<?php echo $_POST['q']; ?>'},function() {$("#1-page").addClass('active');});  //initial page number to load

    $(".paginate_click").click(function (e) {
       
        $("#results").prepend('<div class="loading-indication"><img src="ajax-loader.gif" /> Loading...</div>');
       
        var clicked_id = $(this).attr("id").split("-"); //ID of clicked element, split() to get page number.
        var page_num = parseInt(clicked_id[0]); //clicked_id[0] holds the page number we need
       
        $('.paginate_click').removeClass('active'); //remove any active class
       
        //post page number and load returned data into result element
        //notice (page_num-1), subtract 1 to get actual starting point
        $("#results").load("fetch_pages.php", {'page': (page_num-1), 'q':'<?php echo $_POST['q']; ?>'}, function(){

        });

        $(this).addClass('active'); //add active class to currently clicked element
       
        return false; //prevent going to herf link
    });
});

Die Pagination-Ausgabe & Funktion: pageBuilder

         if(isset($_POST['q'])) {
                $stmt = $dbh->prepare("SELECT count(t.id) as counted FROM table where name LIKE ?");
                if ($stmt->execute(array("%$_POST[q]%"))) {
                    $count = $stmt->fetch();

                }
                
                $dbh = null;
                
                $dbm = new dbclass();
                $paginator = $dbm->pageBuilder($count['counted'], 9);
                echo $paginator;
            }

    function pageBuilder ($maxCount, $perPage) {
        
        $pages = ceil($maxCount/$perPage);   

        //create pagination
        $pagination = '';
        if($pages > 1)
        {
            $pagination .= '<div style="clear: left;">';
            $pagination .= '<ul class="paginate">';
            $pagination .= '<li><a href="#" class="paginate_click" id="1-page">Erste Seite</a></li>';
            for($i = 1; $i<=$pages; $i++)
            {
                $pagination .= '<li><a href="#" class="paginate_click" id="'.$i.'-page">'.$i.'</a></li>';
            }
            $pagination .= '<li><a href="#" class="paginate_click" id="'.$i.'-page">Letzte Seite</a></li>';
            $pagination .= '</ul></div>';
        }
        
        return $pagination;

        
    }

Die Datei "fetch_pages.php"

$item_per_page = 9;
//sanitize post value
$page_number = filter_var($_POST["page"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH);

//validate page number is really numaric
if(!is_numeric($page_number)){die('Invalid page number!');}

//get current starting point of records
$position = ($page_number * $item_per_page);

//Limit our results within a specified range. 
$results = $dbh->prepare("SELECT fields FROM table where name LIKE ? LIMIT $position, $item_per_page");
if ($results->execute(array("%$_POST[q]%"))) {

//output results from database 
while($row = $results->fetch()) 
                        {
                    echo "<div class='teambox'>";
                        echo "<a href='team?q=".$row['field]."'>";
                            echo "<div class='teamimg'>";
                                echo "<img src='".$row['field']."' />";
                            echo "</div>";
                        echo "</a>";
                        echo "<div class='teamdata'>";
                        echo "<h4>" . utf8_encode($row['field']) . "</h4>";
                            echo $row['field'] . " | ";
                        echo "<span>" . utf8_encode($row['field']) . "</span>";
                        echo "</div>";
                    echo "</div>";
                        }
}

 

[mikdoe]

*Beitrag 1 freigeschaltet*