Blättern durch Datenbankergebnisse mit jquery

Question

Ich bin auf der Suche nach Informationen, wie schwierig es sein wird, durch eine Reihe von Ergebnissen aus einer Datenbank mit jquery zu blättern. Ich habe bereits ein Plugin gefunden, aber ich glaube nicht, dass es das ist, was ich brauche.

Ich habe ein Formular mit 8 Textfeldern. Ich möchte diese 8 Textfelder mit dem ersten Datenbankergebnis auffüllen und dann den Seitenwechsel anzeigen, wenn mehr Ergebnisse vorhanden sind. Wenn es mehr Ergebnisse gibt, sollte der Benutzer in der Lage sein, auf die nächste Schaltfläche zu klicken, um die neuen Daten in die Textfelder zu importieren.

Wer hat irgendwelche Vorschläge?

Answer 1

Sie haben nicht erwähnt, welche zugrunde liegende Plattform Sie verwenden. Es ist ASP.NET MVC? Ruby auf Schienen? Die Paging-Unterstützung ist in der Regel in die zugrunde liegende Plattform integriert.

Wenn Sie einen AJAX- oder JSON-Aufruf erstellen möchten, ist jQuery sicherlich dazu in der Lage, aber wie dieser Aufruf aussieht, hängt davon ab, welche Plattform Sie verwenden.

Wenn es Ruby ist, sollten Sie einige Hinweise finden Sie hier: http://www.sitepoint.com/article/ajax-jquery/

Answer 2

Die Art und Weise, dies zu tun (oder die Art, wie ich es tun) ist, dass ich Ajax-Aufrufe an die Paginierung Links binden. Die Links haben die URL integriert und wissen, auf welche Seite sie sich beziehen.

z.B.

<a class="pager" href="/ajax_pages/get_results.php?page=3"> 3 </a> 

Jetzt können Sie die Klicks auf diese Links abfangen die jQuery-Live-Funktion

$(function() { 
     $('a.pager').live('click',function() { 
      var url = $(this).attr('href'); 
      $('#destination').load(url); 
     } 
} 

mit Da Sie ‚live‘ verwenden, müssen Sie nicht den neu generierten HTML manuell binden. Und so sind Ihre Links sofort verfügbar.

Dann müssen Sie nur den Offset-Wert basierend auf der angeforderten Seite und dem Limit generieren (was Ihr Back-End-Dienst wissen sollte).

Die alternative Methode ist sehr nahe, erfordert aber mehr Arbeit in Javascript. Lassen Sie den Service, den Ihr Pager aufruft, json-codierte Daten zurückgeben. Ihre Callback-Funktion muss dann Ihre Seite mit diesen Daten füllen und dann Ihre Paginierungslinks aktualisieren, damit sie korrekt funktionieren.

Dies mag die elegantere Lösung sein, als jedes Mal das gesamte Formular auszublasen, erfordert aber mehr Arbeit. Es ist unwahrscheinlich, dass es sich um einen spürbaren Unterschied handelt.

Answer 3

Persönlich, wenn ich wüsste, dass ich nie wirklich mehr als 5 Seiten haben würde, würde ich auf die Ajax-Sache ganz verzichten ... Nicht, dass ich es nicht mag ... Ich denke nur nicht es ist in diesem Fall notwendig. zum Abfragen der Datenbank (über Ajax) für die nächste Seite oder, um durch Ergebnisse der ersten Abfrage, die sich bereits in der DOM/JSON/XML irgendwo

<?php 
// Example Database result (say, 2 "pages" worth)... 
// We'll pretend the cells in your database match the textarea names... 
$results = array(
    [0] => array(
     'textbox1'=>'abc', 
     'textbox2'=>'def', 
     'textbox3'=>'ghi', 
     'textbox4'=>'jkl', 
     'textbox5'=>'mno', 
     'textbox6'=>'pqr' 
     'textbox6'=>'stu' 
     'textbox6'=>'vwx' 
    ), 
    [1] => array(
     'textbox1'=>'cba', 
     'textbox2'=>'fed', 
     'textbox3'=>'ihg', 
     'textbox4'=>'lkj', 
     'textbox5'=>'onm', 
     'textbox6'=>'rqp' 
     'textbox6'=>'uts' 
     'textbox6'=>'xwv' 
    ) 
) 
$json_results = json_encode($results); 
?> 

<!-- Generate some jQuery and HTML --> 
<script language="javascript"> 
    var pages = eval('<?=$json_results;?>'); 
    $(function() { 
     $('.page_num').live('click',function() { 
      var page = $(this).attr('rel'); 
      if(pages[page] && pages[page].length > 0) { 
       $.each(pages[page],function(key,value) { 
        // assuming your key names are the same as the 
        // names of your textareas 
        $('textarea[name="'+key+'"]').value(value); 
       }); 
      } else { 
       alert("Oops, that page doesn't exist for some reason..."); 
      } 
     }); 
    }); 
</script> 

<?php foreach($results[0] as $key=>$value): ?> 
<textarea name="<?=$key?>"><?=$value;?></textarea> 
<?php endforeach; ?> 

<div id="page_nums"> 
<?php for($i=1;$i<=sizeof($results)-1;$i++): ?> 
<a class="page_num" href="#" rel="<?=$i;?>"><?=$i;?></a> 
<?php endfor; ?>