The News Feed sample application demonstrates how you can get data in the XML format from an Internet connection.
The following figure illustrates the main screen of the News Feed.
Figure: News Feed screen
The application opens with the first page of the news feed. To move to the next page, touch the screen.
Source Files
You can create and view the sample application project including the source files in the IDE.
| File name | Description |
|---|---|
| css/style.css | This file contains CSS styling for the application UI. |
| index.html | This is a starting file from which the application starts loading. It contains the layout of the application screen. |
| app.js | This file defines the operations of the application, such as sending requests and receiving data. |
Implementation
The following code in the main.js file sends an XML request and receives the return data:
xmlhttp = new XMLHttpRequest();
xmlhttp.open(XML_METHOD, XML_ADDRESS, false);
xmlhttp.onreadystatechange = function()
{
if (xmlhttp.readyState === 4)
{
if (xmlhttp.status === 200)
{
clearElmText(objNews);
xmlDoc = xmlhttp.responseXML;
dataItem = xmlDoc.getElementsByTagName('item');
if (dataItem.length > 0)
{
lengthNews = (dataItem.length > NUM_MAX_NEWS) ? NUM_MAX_NEWS : dataItem.length;
for (i = 0; i < lengthNews; i++)
{
arrayNews.push(
{
title: dataItem[i].getElementsByTagName('title')[0].childNodes[0].nodeValue,
link: dataItem[i].getElementsByTagName('link')[0].childNodes[0].nodeValue
});
arrayNews[i].title = trimText(arrayNews[i].title, NUM_MAX_LENGTH_SUBJECT);
}
resetNewsIndex();
showNews();
}
else
{
addElmText(objNews, 'subject', MSG_ERR_NODATA);
}
xmlhttp = null;
}
}
};
xmlhttp.send();