곽성훈
곽성훈

Reputation: 19

JSON and JavaScript - how to read my list by using json

I don't know why I can not read object by using below way

function loadData(){
    $.getJSON('data.json', function(data) {
        $.each(data, function(Index, entry) {
            mem = new user(entry.name, entry.age, entry.location);
            userList.push(mem);
        });
    });
    return false;
}

function fillTable(){
    var html = "";
    console.log(userList);
    console.log(userList[0].name);
    $.each(userList,function(index , user){
       console.log(index);
        html += '<tr>';
        html +=  '<th>'+this.name+'</th>';
        html +=  '<th>'+this.age+'</th>';
        html +=  '<th>'+this.loca+'</th>';
        html += '</tr>'

        console.log(this.name);
    });
    $("#listTable").html(html);
}

the screen shot of above result in console is enter image description here

Upvotes: 1

Views: 59

Answers (2)

Ankit Kumar Gupta
Ankit Kumar Gupta

Reputation: 1322

   function loadData(){
        $.getJSON('data.json', function(data) {
            $.each(data, function(Index, entry) {
                mem = new user(entry.name, entry.age, entry.location);
                userList.push(mem);
            });
      fillTable()
        });

        return false;
    }      

   function fillTable(){
        var html = "";
        console.log(userList);
        console.log(userList[0].name);
        var self = this;
        $.each(userList,function(index , user){
           console.log(index);
            html += '<tr>';
            html +=  '<th>'+self.name+'</th>';
            html +=  '<th>'+self.age+'</th>';
            html +=  '<th>'+self.loca+'</th>';
            html += '</tr>'

            console.log(self.name);
        });

}

this will point to inside function, you need to delcare this outside this in outside function.

Try this it may work

Upvotes: 0

Anil
Anil

Reputation: 3752

Call fillTable in loadData function, as getJson is async

function loadData(){
            $.getJSON('data.json', function(data) {
                $.each(data, function(Index, entry) {
                    mem = new user(entry.name, entry.age, entry.location);
                    userList.push(mem);
                });
fillTable(); -- call it here
            });

            return false;
        }

Upvotes: 2

Related Questions