Api daten verarbeiten - in Tabelle ausgeben - bitte um Hilfe


klausi89

Erfahrenes Mitglied
#1
Hallo ich hoffe mir kann jemand helfen....ich möchte gerne Daten über eine Api auslesen und in einer Bootstrap "datatable" verarbeiten

Die Tabelle an sich hab ich ja hinbekommen ( immer 10 Datensätze pro Seite) aber leider habert es wieder einmal am auslesen und einfügen der Dateien über eine Api

der Anbieter stellt mir folgendes zur Verfügung:

https://apianbieter.com/api/listv1/list?api_key=YOUR_API_KEY_HERE

{
"status": 200,
"message": "OK",
"list_data": {
"premium": {
"BTC": [
{
"name": "Anbieter1",
"url": "https://www.anbieter1.com",
"owner_id": "123",
"owner_name": "anbieter1",
"currency": "BTC",
"timer_in_minutes": "1440",
"reward": "3000",
"is_enabled": "1",
"creation_date": "1480028524",
"category": "1,4",
"paid_today": 0.00226897,
"paid_week": 0.00688604,
"paid_total": 0.13068441,
"active_users": 109,
"estimated_2_week_payout": 0.01032906,
"balance": 0.01855018,
"health": 100
},
*/ etc. */
]}
}

folgendes möchte ich gerne in der Tabelle anzeigen:

Name | Creation_date | Timer_in_minutes | paid_week | active_users | health | url (go to url)

Anbieter1 - 2 monate - 60 min - 0,125 - 512 - 100% - <a href="http://www.anbieter1.com">anbieter1<a/>
Anbieter2 - 5 monate - 90 min - 0,035 - 604 - 90% - <a href="http://www.anbieter2.net">anbieter2<a/>

usw.
es wäre sehr nett wenn mir mal bitte jemand helfen könnte wie ich das nun realisieren könnte.

Hoffe es hätte mal jemand etwas Zeit sich das mal anzuschauen.
Danke schonmal.
 

klausi89

Erfahrenes Mitglied
#6
naja wie oben beschrieben die Api auslesen per http post und die Daten verarbeiten

curl ?
json - array ?

wie auch immer da fehlt mir leider die Kenntnis
und über 600 Datensätze da einzeln einfügen ist auch schwierig glaub ich
 

klausi89

Erfahrenes Mitglied
#8
ja genau :) hatte bisher manuell Daten in die Tabelle eingegeben....wird mir aber langsam zu aufwendig deshalb würde ich dies eben gerne über die api automatisch befüllen.....
nur leider habert es am auslesen mit curl json_decode usw.

soviel wie ich mir das schon angeschaut habe - ich steig leider immer noch nicht dahinter wie es richtig funktioniert :-(
 

Sempervivum

Erfahrenes Mitglied
#9
Dann gibt es im wesentlichen zwei Wege, dein Ziel zu erreichen:
  1. Das JSON in ein geschachteltetes Array umzuwandeln, dieses auszulesen und aus den Daten das HTML der Tabelle zu erzeugen.
  2. Die Ajax-Option von Datatables für verschachtelte Objekte verwenden wie hier beschrieben: https://datatables.net/examples/ajax/deep.html. Diese Lösung scheint mir eleganter zu sein und ich würde sie empfehlen.
 

Sempervivum

Erfahrenes Mitglied
#11
Ich habe mal für Option 2 eine Demo aufgebaut, die die Daten ausliest und in die Tabelle einträgt. Dort musst Du den Kopf der Tabelle und weitere Spalten ergänzen:
Code:
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">
    <title>DataTables example - Child rows (show extra / detailed information)</title>

    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" language="javascript" class="init"></script>

</head>
<body>
    <table id="table-ajax">
    </table>
    <script>
        $('#table-ajax').DataTable({
            "processing": true,
            "ajax": {
                "url": "datatables-ajax.json", // hier die URL deiner API eintragen
                "dataSrc": "list_data.premium.BTC"
            },
            "columns": [
                { "data": "name" },
                { "data": "owner_name" }
                // hier weitere Spalten ergaenzen
            ]
        });
    </script>
</body>
</html>
 

klausi89

Erfahrenes Mitglied
#12
Hallo und danke schon mal für die Hilfe das klappt bis hier her ganz gut nur ein paar kleine Dinge hätte ich noch

und zwar:

creation_date - wird in Tage angegeben...kann man das umrechnen lassen das er z.Bsp. 2 Monate anzeigt ?
url - hier wird die Url angezeigt hätte da aber lieber einen Button (bootstrap) der per target ="_blank" anklickbar ist

und kann man den die sortierung voreinstellen das er z.Bsp nach paid_week anzeigt

lg
 

Sempervivum

Erfahrenes Mitglied
#13
kann man den die sortierung voreinstellen das er z.Bsp nach paid_week anzeigt
Das ist einfach, siehe hier:
https://datatables.net/examples/basic_init/table_sorting.html

creation_date - wird in Tage angegeben...kann man das umrechnen lassen das er z.Bsp. 2 Monate anzeigt ?
url - hier wird die Url angezeigt hätte da aber lieber einen Button (bootstrap) der per target ="_blank" anklickbar ist
Da gibt es die Möglichkeit, der Wert einer Zelle spaltenspezifisch fürr die Anzeige vorzubereiten, siehe hier:
https://stackoverflow.com/questions/28617443/datatables-format-returning-ajax-data
https://datatables.net/examples/advanced_init/column_render.html
 

klausi89

Erfahrenes Mitglied
#15
sry irgendwie versteh ich das nicht so richtig
ich habe diesen Code von datatables eingefügt
<script>
$(document).ready(function() {
$('#datatablename').DataTable( {
"order": [[ 3, "desc" ]]
} );
} );
</script>

eingefügt

bekomme aber immer diesen Fehler:

DataTables warning: table id=datatablename - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3

wo genau muss das den hin ? sry das ist völliges neuland für mich
 

Sempervivum

Erfahrenes Mitglied
#16
Offenbar hast Du den Code mit dem "order" komplett hinzu gefügt. Du darfst dataTable() nur einmal aufrufen und bei diesem Aufruf das Objekt mit "order" übergeben, wie in dem Beispiel.
 

Sempervivum

Erfahrenes Mitglied
#19
Musste selber ein wenig suchen, aber so funktioniert es:
Code:
    <table id="table-ajax">
    </table>
    <script>
        $('#table-ajax').DataTable({
            "processing": true,
            "ajax": {
                "url": "datatables-ajax.json",
                "dataSrc": "list_data.premium.BTC"
            },
            "columns": [
                { "data": "name" },
                { "data": "owner_name" }
            ],
            "order": [[1, "desc"]]
        });
    </script>