钛工作室答案

【问题标题】：Titanium Studio钛工作室
【发布时间】：2013-09-23 23:40:01
【问题描述】：

我已经设置了我的表和行以从我的在线数据库中提取 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();

【问题讨论】：

标签： javascript json titanium titanium-mobile

【解决方案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);

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

【讨论】：