API 呼び出しからのこのような json 応答があります。
`{
"id": "7",
"issue_title": "Apr - May 2015",
"issue_no": "Issue 1.4",
"cover_image_url": "http://www.link.org/apr--may-2015-7.jpg",
"synopsis_pdf_url": "",
"advertisers_pdf_url": "",
"issue_date": "01-04-2015",
"issue_year": "2015"
},
{
"id": "3",
"issue_title": "Feb-Mar 2015",
"issue_no": "Issue 1.3",
"cover_image_url": "http://www.link.org/febmar-2015-3.jpg",
"synopsis_pdf_url": "http://www.link.org/febmar-2015-3.pdf",
"advertisers_pdf_url": "http://www.link.org/febmar-2015-3.pdf",
"issue_date": "01-02-2015",
"issue_year": "2015"
},
{
"id": "2",
"issue_title": "Dec 2014 - Jan 2015",
"issue_no": "Issue 1.2",
"cover_image_url": "http://www.link.org/dec-2014--jan-2015-2.jpg",
"synopsis_pdf_url": "",
"advertisers_pdf_url": "",
"issue_date": "01-12-2014",
"issue_year": "2014"
},
{
"id": "1",
"issue_title": "Oct - Nov 2014",
"issue_no": "Issue 1.1",
"cover_image_url": "http://www.link.org/oct--nov-2014-1.jpg",
"synopsis_pdf_url": "",
"advertisers_pdf_url": "",
"issue_date": "01-10-2014",
"issue_year": "2014"
}`
今issue_year、ピッカーに表示しているものを取得しています。
ユーザーがissue_yearテーブルデータをクリックすると、同じレコードのみが表示されますissue_year。ピッカーから 2014 をクリックすると、3 番目と 4 番目のレコードのみが表示されます。コントローラーから、クリックで同じものを取得するようにピッカーデータが準備されているときに、ピッカーで jsonResponse[i] オブジェクトを渡していますが、取得していますundefined。
jsコードは以下の通り
function openpastIssues(e) {
var url = "http://example.com/api/past_year_issue.aspx";
var jsonResponse;
var response;
var data = [];
var pickerData = [];
var singleData = [];
var row;
var xhr = Ti.Network.createHTTPClient({
onload : function() {
// parse the retrieved data, turning it into a JavaScript object
Ti.API.info("From Past Issues (function): " + this.responseText);
jsonResponse = JSON.parse(this.responseText);
var rowHeight = 150;
// just pick the right height here
var imageRowIsFull = false;
var myImage;
var issuelbl;
var row = Ti.UI.createTableViewRow({
width : Ti.UI.SIZE,
height : Ti.UI.SIZE,
layout : "horizontal"
});
for (var i = 0; i < jsonResponse.length; i++) {
var tView = Ti.UI.createView({
width : Ti.UI.SIZE,
height : Ti.UI.SIZE,
left : "5%",
right : "5%",
top : "5",
bottom : "5",
backgroundColor : "#A9F5A9",
//backgroundColor : "black",
layout : "vertical"
});
issuelbl = Ti.UI.createLabel({
color : 'blue',
text : jsonResponse[i].issue_title,
height : "auto",
width : "auto",
left : "3%",
font : {
fontSize : 13
},
});
tView.add(issuelbl);
myImage = Ti.UI.createImageView({
width : 120,
//left : "5%",
//right : "5%",
top : "5",
//bottom:"5",
height : 150,
image : jsonResponse[i].cover_image_url,
obj : jsonResponse[i]
});
tView.add(myImage);
try {
myImage.addEventListener('click', function(e) {
Ti.API.info('Clicked data = ' + JSON.stringify(e.source.obj));
var jsonRes = e.source.obj;
Alloy.createController('singleissue', jsonRes);
});
} catch(e) {
}
row.add(tView);
//row.add(myImage);
imageRowIsFull = false;
if ((i + 1) % 2 == 0) {//this will add a new row every 2 items.
imageRowIsFull = true;
data.push(row);
row = Ti.UI.createTableViewRow({
width : Ti.UI.SIZE,
height : Ti.UI.SIZE,
layout : "horizontal",
filterCriteria :jsonResponse[i].issue_year
});
}
pickerData[i] = Ti.UI.createPickerRow({
title : jsonResponse[i].issue_year,
obj : jsonResponse[i]
});
}
if (!imageRowIsFull) {//do not forget to add the last row
data.push(row);
}
//table.setData(data);
$.issueTable.setData(data);
$.picker.add(pickerData);
},
onerror : function(e) {
Ti.API.debug(e.error);
alert('error');
},
timeout : 5000
});
xhr.open("GET", url);
xhr.send();
}
$.picker.addEventListener('change', function(e) {
Ti.API.info('From picker ' + e.source.obj);
});
xml ファイル
<Alloy>
<Window id="winpast" class="container" title="Past issues" onOpen="openpastIssues">
<View id="view2" width="Ti.UI.FILL" height="Ti.UI.FILL" backgroundColor="#A9F5A9" >
<View id="viewcheck1" >
<Label id="title" width="Ti.UI.SIZE" text="Past Issues" height="Ti.UI.SIZE" textAlign="Ti.UI.TEXT_ALIGNMENT_CENTER"></Label>
<ImageView id="menuImg" image="/images/menu.png" onClick="showsideBar" left="5"></ImageView>
<Picker id="picker" selectionIndicator="true" height="Ti.UI.SIZE" width="Ti.UI.SIZE" right="10">
</Picker>
</View>
<View id="tablePast" width="Ti.UI.FILL" height="Ti.UI.FILL" top="40">
<TableView id="issueTable" scrollable="true"></TableView>
</View>
<View id="viewBelow" width="150" height="Ti.UI.FILL" backgroundColor="#A9A5A9" left="-150" visible="false" top="40">
<TableView id="menuTable"></TableView>
</View>
</View>
</Window>
</Alloy>
基本的には、ピッカーから選択した特定の年のレコードを表示したいと考えています。
誰でもこれについて助けてください。私はこれに多くの時間を費やしました。