javascript - 钛工作室

Question

我已经设置了表和行以从在线数据库中提取 JSON 数据，但问题是我有分页数据。虽然我的数据显示在第一页，但我不确定如何设置 JSON 拉取，以便它将从其他分页页面拉取 JSON 数据，特别是在动态创建更多页面的情况下。即页=4，页=5。示例:

当前正在提取数据 -

首页 - http://testsite.com/data.json

分页页面 (1) - http://testsite.com/data.json?page=2

分页页面 (2) - http://testsite.com/data.json?page=3

等等。 以下是我的代码当前的设置方式:

    var win = Ti.UI.currentWindow;



var data = [],


    Detail = require('detail');

var barList = Titanium.UI.createTableView({
    height: 366,
    width: 320,
    top: 0,
    left: 0
});
win.add(barList);
barList.addEventListener('click', function (e) {
    Ti.API.info('data: ' + JSON.stringify(e.rowData.data));
    var detail = new Detail(e.rowData.data);
    detail.open({modal:true});
});

var xhr = Titanium.Network.createHTTPClient();
xhr.onload = function () {
    var json = JSON.parse(this.responseText);
    Ti.API.info(json.length);
    for (var i = 0; i < json.length; i++) {
        var row = Titanium.UI.createTableViewRow({
            className: 'bar-row',
            data: json[i].bar, 
            hasChild: true,
            filter: json[i].bar.name
        });
        var titleLabel = Titanium.UI.createLabel({
            text: json[i].bar.name,
            font: {
                fontSize: 14,
                fontWeight: 'bold'
            },
            left: 70,
            top: 5,
            height: 20,
            width: 210
        });
        row.add(titleLabel);

        data.push(row);
    }
    barList.setData(data);
};
xhr.open('GET', 'http://testsite.com/data.json');
xhr.send();

win.open();

Answer 1

这个怎么样？

var win = Ti.UI.currentWindow,
    data = [],
    Detail = require('detail');

var barList = Titanium.UI.createTableView({
    height: 366,
    width: 320,
    top: 0,
    left: 0
});
win.add(barList);

barList.addEventListener('click', function (e) {
    Ti.API.info('data: ' + JSON.stringify(e.rowData.data));
    var detail = new Detail(e.rowData.data);
    detail.open({modal:true});
});

function fetchTableData(page) {
    if(!page) return alert('Please add a page number!');
    page = page > 1 ? "?page=" + page : "";
    var xhr = Titanium.Network.createHTTPClient();
    xhr.onsuccess = function() {
        if(this.responseText) {
            appendTableData(this.responseText);
        }
    }
    xhr.open('GET', 'http://testsite.com/data.json' + page);
    xhr.send();
}

function appendTableData(response) {
    var json = JSON.parse(response);
    for (var i = 0; i < json.length; i++) {
        var row = Titanium.UI.createTableViewRow({
            className: 'bar-row',
            data: json[i].bar, 
            hasChild: true,
            filter: json[i].bar.name
        });
        var titleLabel = Titanium.UI.createLabel({
            text: json[i].bar.name,
            font: {
                fontSize: 14,
                fontWeight: 'bold'
            },
            left: 70,
            top: 5,
            height: 20,
            width: 210
        });
        row.add(titleLabel);
        barList.appendRow(row);            
    }
}

win.open();
fetchTableData(1);

请注意，可能需要对响应进行更多有效性检查...