显示已存在的数据记录
Having reviewed the structure of content pages in DetailPage.html, let us look into how to populate the contact details for an existing contact. Recall that the ContactsActivity.showContact() method displays DetailPage.html appending id of the contact as an HTTP query string, e.g. DetailPage.html?23. Let us see below how JavaScript code in DetailPage.html will process that information. The related section in jQuery $(document).ready() function is given below.
在知道了页面结构后，我们现在看下，如何将后端的数据显示在前端的界面中，这样当用户点选一个已存在的通讯录时，会把该通讯录的详细信息显示出来。我们看下之前说的，举例说到的DetailPage.html?23这样方式的链接，看下在DetailPage.html中，是如何用Javascript去读取后端的数据的，关键是看jQuery中的ready()方法中处理的代码，如下：
...
showProgress();
contactIdVar.val(window.location.search.substring(1));
contactSupport.getContact(contactIdVar.val(),'setCurrentContact');
});
· 首先是加载了进度等待图标
· 然后用window.location.search.substring(1)获得了当前链接的中?号后的参数，比如对于DetailPage.html?23这个例子来说，获得了23的值，并且赋值给 contactIdVar.val这个变量。
· 最后，通过调用后端JAVA应用的ContactsActivity.getContact()方法，传入的是两个参数，一个是当前通讯录的id,另外的setCurrentContact是回调前端显示处理结果的Javascript方法。下面看下ContactsActivity.getContact()方法的实现，如下：
String json = ContactUtility.getContactJSON(contactId, ...);
final String callbackFunction = "javascript:" + contactCallback + "('" + json + "')";
loadURL(callbackFunction);
}
这里，通过getContactJSON方法，产生了JSON格式的数据。下面看下如何产生JSON格式的数据。下面是应用中模拟生成的JSON代码，代码如下：
"contactId":"265",
"firstName":"Aafjes",
"lastName":"Bertus",
"note":{"rowId":"2265","text":"Author"},
"ims":[
{"rowId":"2274","protocol":"-1","value":""},
{"rowId":"2275","protocol":"0","value":"bertus@aim"},
{"rowId":"2276","protocol":"5","value":"bertus@google"},
{"rowId":"2277","protocol":"6","value":""},
。。。。。。。
],
"phones":[
{"rowId":"2284","type":"1","no":"111-222-3333"},
{"rowId":"2285","type":"2","no":"222-000-9999"},
{"rowId":"2286","type":"3","no":"444-787-9900"},
{"rowId":"2287","type":"7","no":"555-744-9999"}
],
"emails":[
{"rowId":"2271","type":"1","value":"bertus@home.xyz"},
{"rowId":"2272","type":"2","value":"bertus@work.xyz"},
{"rowId":"2273","type":"3","value":"bertus@other.xyz"}
],
"organizations":[
{"rowId":"2269","type":"1","name":"Publications Inc.","title":"CEO"},
{"rowId":"2270","type":"2","name":"Volunteers Corp.","title":"Member"}
],
"addresses":[
{"rowId":"2266","type":"1","street":"Alhambra st.","city":"Alhambra","state":"MI",
"country":"USA","zip":"48100","poBox":""},
{"rowId":"2267","type":"2","street":"1 Corporation st","city":"Alhambra","state":"MI",
"country":"USA","zip":"48000","poBox":"44456"},
{"rowId":"2268","type":"3","street":"","city":"","state":"",
"country":"","zip":"","poBox":""}
]
}
以上的JSON中，contactId, firstName, lastName都是字符串类型，而address,email,phones等都是每个JSON对象中包含了多个对象，形成一个JSON数组。
· 注意在以上的对象中，都有一个rowId，它都是不会重复的，用以区别不同的记录，也方便在前端Javascript代码中进行处理。
· 在ims数组中，有protocol属性，它代表是用户使用哪种即时通讯工具，这是由Android 通讯录 API给出的定义，定义如下：
o protocol=-1, 自定义
o protocol=0, AIM
o protocol=1, MSN
o protocol=2, Yahoo
o protocol=3, Skype
o protocol=4, QQ
o protocol=5, Google
o protocol=6, ICQ
o protocol=7, Jabber
· 同样，在phones数组中的type属性，也是Android 通讯录 API给出的定义，如下：
o type=1, Home
o type=2, Mobile
o type=3, Work
o type=7, Other
· emails数组中的type属性，API定义如下：
o type=1, Home
o type=2, Work
o type=3, Other
· organizations 数组中的type属性定义如下：
o type=1, Work
o type=2, Other
· addresses 数组中的type属性定义如下：
o type=1, Home
o type=2, Work
o type=3, Other
