der-ingo
Goto Top

JS-Funktion für DATATABLES direkt in DIV ausgeben

Hallo zusammen,
ich möchte gerne zu meiner DATATABLES -Tabelle ein zusätzliches DIV mit einem Zähler
hinzufügen. DATATABLES bietet von Haus aus eine solche Zählfunktion an, allerdings benötige
ich noch ein zusätzliches Feld. Bisher bekomme ich den Wert allerdings leider nur via Buttonklick
ausgegeben. Kann man eventuell den Zähler direkt via ID an ein DIV weitergeben, ohne das man einen
Klick als Auslöser benötigt ?


So zum Beispiel

<div id="zaehler"></div>  


Hier der bisherige JS Code

<button id="zaehler" >Anzahl der Datenbankeinträge</button>  

<script type="text/javascript">  
    
$(document).ready(function () {
    
    $('#zaehler').click(function() {  
        var tbl = $('#example').DataTable();  
        alert(tbl.page.info().recordsTotal);
    });    
});

</script>

Grüße Ingo

Content-Key: 396114

Url: https://administrator.de/contentid/396114

Printed on: May 7, 2024 at 07:05 o'clock

Member: Arano
Arano Dec 19, 2018 at 11:40:47 (UTC)
Goto Top
Hallo Ingo.

Kann man eventuell den Zähler direkt via ID an ein DIV weitergeben, ohne das man einen Klick als Auslöser benötigt ?
document.getElementById('zaehlerid').innerHTML = tbl.page.info().recordsTotal  

So !?


~Arano
Mitglied: 137846
Solution 137846 Dec 19, 2018, updated at Dec 20, 2018 at 11:02:50 (UTC)
Goto Top
<div id="zaehler"></div>  

<script type="text/javascript">  
$(document).ready(function () {
 $('#zaehler').text($('#example').DataTable().page.info().recordsTotal);  
});
</script>
Member: Der-Ingo
Der-Ingo Dec 19, 2018 at 18:52:50 (UTC)
Goto Top
Vielen Dank für eure Antworten.
Also bei beiden Lösungen passiert bei mir gar nichts,
weder eine Fehlermeldung noch eine Ausgabe. Die
oben genannte Funktion mit dem JS-Alert funktioniert tadelos
ebenso eine Ausgabe über einen Button in ein Div aber eine direkte
Anzeige "ohne Klick" bekomme ich nicht hin. Das DIv bleibt leer.

Ich gehe stark davon aus, dass ICH etwas verkehrt mache, sehe
aber gerade meinen Fehler nicht, sorry.

Grüße Ingo
Mitglied: 137846
Solution 137846 Dec 20, 2018 updated at 10:21:22 (UTC)
Goto Top
sehe aber gerade meinen Fehler nicht, sorry.
Wir auch nicht, sorry aber die Glaskugeln hängen schon am Christbaum, an den obigen Codes ist nämlich nichts auszusetzen wenn man sie denn auch richtig anwendet. Copy n Paste bringt dich im Leben nicht weiter, du musst dazu auch minimal die Doku lesen und vor allem auch verstehen und dann anwenden und debuggen, die Grundlagen jedes Anwendungsentwicklers!

Das es geht, siehe dein Beispiel Live (Zaehler-Box ist die blaue Box in der Preview):
http://jsfiddle.net/y76gcws0/2/
Member: Der-Ingo
Der-Ingo Dec 20, 2018 updated at 10:58:22 (UTC)
Goto Top
Hi,
erst einmal vielen Dank für deine Hilfe !
Dass es jetzt geht ist auch klar. Nun ist ja auch die Syntax anders bzw. richtig.

Statt
$('#zaehler').text($('#example').DataTable().page.info().recordsTotal));  

hast du jetzt folgendes eingesetzt
$('#zaehler').text($('#example').DataTable().page.info().recordsTotal);  

Grüße Ingo
Mitglied: 137846
137846 Dec 20, 2018 updated at 11:04:17 (UTC)
Goto Top
Die Fehlermeldung in der Konsole hätte es dir ja gezeigt face-smile.

Schöne Festtage.