Anfängerfrage zu return, array und object...

[littles]

Hallo,
neu in der javascript Welt und direkt schon ein problem .  

Code:

function getData() {
    
        $.ajax({
        url: './db/functions.php?function=getDB',
        type: "GET",
        dataType: "json",
        success: function (data) {
        
            
                $.each(JSON.parse(JSON.stringify(data)), function(idx, obj) {
                obj_array.push(obj);
                });
            createTable(obj_array);
            
            }
           
        });
        return obj_array;
        
        
    }

Wenn ich in dieser Funkion createTable aufrufe, funktioniert alles wie erwartet.

Code:

function createTable(object_array) {
    

    console.log(object_array);
    var table = document.createElement("table");
    var innerT = "<thead><tr class='first_row'>";
    //get all table keys
    const table_headers = Object.keys(object_array[0]);
    //create table header_row from keys
    for    (var i =0; i < table_headers.length; i++) {
    innerT += "<td>"+table_headers[i]+"</td>"
    }
    innerT += "</tr> </thead><tbody>";
    //create table data_rows
    for (var i =0; i < object_array.length; i++) {
        innerT+= "<tr><td>"+
        object_array[i].id+"</td><td>"+
        object_array[i].field0_0+"</td><td>"+
        object_array[i].field0_1+"</td><td>"+
        object_array[i].field0_2+"</td><td>"+
        object_array[i].field1_0+"</td><td>"+
        object_array[i].field1_1+"</td><td>"+
        object_array[i].field1_2+"</td><td>"+
        object_array[i].field2_0+"</td><td>"+
        object_array[i].field2_1+"</td><td>"+
        object_array[i].field2_2+"</td></tr>";
}
innerT +="</tbody>"
table.innerHTML = innerT;

document.getElementById('table_holder').append(table);

}

Table wird angezteigt,
ausgabe in der Konsole (gekürzt):

Code:

Array(154) [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, … ]
​
[0…99]
​​
0: Object { id: 1, field0_0: 0, field0_1: 0, … }
​​
1: Object { id: 2, field0_0: 1, field0_1: 0, … }
​​
2: Object { id: 3, field0_0: 0, field0_1: 1, … }
​​
...
​
[100…153]
​​
100: Object { id: 101, field0_0: 1, field0_1: 0, … }
​​
101: Object { id: 102, field0_0: 1, field0_1: 0, … }
​​...
​
<prototype>: Array []

Mein problem liegt hier:

Code:

<script type="text/javascript">
    $(document).ready( function() {        
        console.log(getData());
    })
</script>

Ausgabe in der Konsole:

Code:

Array []
​
0: Object { id: 1, field0_0: 0, field0_1: 0, … }
​
1: Object { id: 2, field0_0: 1, field0_1: 0, … }

​...

length: 154
​
<prototype>: Array []

Wie bekomme ich die daten, wie in der create_table function bzw. wie kann ich mit den daten weiter arbeiten?

[littles]

Ich denke ich habe meinen Fehler entdeckt. Das Array ist leer, weil die Abfrage kam, bevor die Daten aus der Datenbank eingelesen waren. Stellt sich für mich jetzt die Frage, wie ich darauf warten kann, dass die Daten verfügbar sind und erst dann ein Ergebnis via return zurück liefere.

[rzscout]

Hi littles ich würde dir empfehlen auf jQuery zu verzichten. JavaScript bietet ausreichend Funktionalität und Methoden um ein XMLHTTP-Request gut zu verarbeiten.