Unable to get the JSON file to parse in TableView in JavaScript using Appcelerator

I’m trying to get a JSON file into a table in JavaScript using Appcelerator and I’m not quite sure why it is outputting as an empty table when compiling to an example page. I’m rather new to dealing with both JavaScript and JSON formats, so if you see any silly logical or syntax mistakes, please go easy on me and also let me know how I can fix my issue:

// Set the background color with no windows or tabs
Titanium.UI.setBackgroundColor('#000');

// Create the window
var win1 = Titanium.UI.createWindow({
    title:'Challenge Window',
    backgroundColor:'#fff',
});

// Store the image and its properties
    var image = Titanium.UI.createImageView({
    image: "https://myavantiservices.files.wordpress.com/2015/02/helloworld.gif",
    height: 380,
    width: 380,
    center: 512,
    top: -50
});

var tableData;

// Parse our JSON file using onload
var url = "https://www.sitepoint.com/twitter-json-example/";
var json;
var xhr = Ti.Network.createHTTPClient({
    onload: function() {
        json = JSON.parse(this.responseText);
        tableData = json;
    }
});

// Create the table and insert the JSON data
var table = Titanium.UI.createTableView({
    data: tableData,
    height: 480,
    width: 480,
    top: 256,
    left: 232
});

// Add the image to the window and open the window
win1.add(image);
win1.add(table);
win1.open();

The JSON returned by the url:

{"results":[

     {"text":"@twitterapi  https://code.google.com/archive/p/twitter-api/issues/353",

     "to_user_id":396524,

     "to_user":"TwitterAPI",

     "from_user":"jkoum",

     "metadata":

     {

      "result_type":"popular",

      "recent_retweets": 109

     },

     "id":1478555574,   

     "from_user_id":1833773,

     "iso_language_code":"nl",

     "source":"twitter",

     "profile_image_url":"http://s3.amazonaws.com/twitter_production/profile_images/118412707/2522215727_a5f07da155_b_normal.jpg",

     "created_at":"Wed, 08 Apr 2009 19:22:10 +0000"},

     ... truncated ...],

     "since_id":0,

     "max_id":1480307926,

     "refresh_url":"?since_id=1480307926&q=%40twitterapi",

     "results_per_page":15,

     "next_page":"?page=2&max_id=1480307926&q=%40twitterapi",

     "completed_in":0.031704,

     "page":1,

     "query":"%40twitterapi"}

    }

You need to move everything that relies on the JSON response to be inside of the onload
block. Otherwise, the table will be constructed before tableData
has any data. You also aren’t actually sending the xhr
.

Once you get a URL that actually returns that JSON, you can use this:

var url = "https://www.sitepoint.com/twitter-json-example/";
var json;
var xhr = Ti.Network.createHTTPClient({
    onload: function() {
        json = JSON.parse(this.responseText);
        tableData = json;

        var table = Titanium.UI.createTableView({
            data: tableData,
            height: 480,
            width: 480,
            top: 256,
            left: 232
        });

        win1.add(image);
        win1.add(table);
        win1.open();
    }
});
xhr.open("GET", url);
xhr.send();
Hello, buddy!稿源:Hello, buddy! (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 前端开发 » Unable to get the JSON file to parse in TableView in JavaScript using Appcelerator

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录