C
carlos
I am writing the below javascript to populate an array with content
that I get from a google blog feed. I load the first array items value
by doing an innerHTML on a DOM element. The problem I am facing is
that when a user clicks the next button, I want my javascript function
(showNext) to get the next array item, and inject that array value in
the dom element. It seems to be working, but after I inject the new
content, the page is being reloaded, and it calls the same method that
originally loaded the first array items content (page_load - which is
called on the body onload). I tried setting a global variable called
"postback" that set the value to true once the page loads for the
first time. However, after I click next, the value gets reset again. I
am confused as to why this value is not being retained? It is in the
global cache right? Can someone take a peak at the code and give me
some suggestions?
var aContent = new Array();
var aTitle = new Array();
var aDate = new Array();
var activeIndex = 0;
var postBack = false;
function page_load(query) {
// Retrieve the JSON feed.
var script = document.createElement('script');
script.setAttribute('src', 'http://' + 'bikebr' + '.blogspot.com/
feeds/posts' +
'/default?alt=json-in-
script&callback=fillArrays');
script.setAttribute('id', 'jsonScript');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
function fillArrays(json) {
if(!postback) {
//store all entries
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry;
aTitle = entry.title.$t;
var postDesc = "posted: ";
aDate = postDesc + json.feed.updated.$t.substring(0,10) +
" ";
aContent = entry.content.$t;
}
//inject the first blog items into the page
document.getElementById('content').innerHTML = aContent[0];
document.getElementById('header').innerHTML = aTitle[0];
document.getElementById('date').innerHTML = aDate[0];
postBack = true;
}
}
function showContent(data) {
var divToInject = document.getElementById('data');
var newDiv = document.createElement('div');
newDiv.innerHTML = data;
divToInject.appendChild(newDiv);
}
function showNext() {
var i = activeIndex + 1;
if(i > aContent.length) {
i==0;
}
debugger;
document.getElementById('header').innerHTML = aTitle;
document.getElementById('content').innerHTML = aContent;
document.getElementById('date').innerHTML = aDate;
}
function showPrev() {
var i = activeIndex - 1;
if(i <= 0) {
i==0;
}
document.getElementById('header').innerHTML = aTitle;
document.getElementById('content').innerHTML = aContent;
document.getElementById('date').innerHTML = aDate;
}
that I get from a google blog feed. I load the first array items value
by doing an innerHTML on a DOM element. The problem I am facing is
that when a user clicks the next button, I want my javascript function
(showNext) to get the next array item, and inject that array value in
the dom element. It seems to be working, but after I inject the new
content, the page is being reloaded, and it calls the same method that
originally loaded the first array items content (page_load - which is
called on the body onload). I tried setting a global variable called
"postback" that set the value to true once the page loads for the
first time. However, after I click next, the value gets reset again. I
am confused as to why this value is not being retained? It is in the
global cache right? Can someone take a peak at the code and give me
some suggestions?
var aContent = new Array();
var aTitle = new Array();
var aDate = new Array();
var activeIndex = 0;
var postBack = false;
function page_load(query) {
// Retrieve the JSON feed.
var script = document.createElement('script');
script.setAttribute('src', 'http://' + 'bikebr' + '.blogspot.com/
feeds/posts' +
'/default?alt=json-in-
script&callback=fillArrays');
script.setAttribute('id', 'jsonScript');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
function fillArrays(json) {
if(!postback) {
//store all entries
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry;
aTitle = entry.title.$t;
var postDesc = "posted: ";
aDate = postDesc + json.feed.updated.$t.substring(0,10) +
" ";
aContent = entry.content.$t;
}
//inject the first blog items into the page
document.getElementById('content').innerHTML = aContent[0];
document.getElementById('header').innerHTML = aTitle[0];
document.getElementById('date').innerHTML = aDate[0];
postBack = true;
}
}
function showContent(data) {
var divToInject = document.getElementById('data');
var newDiv = document.createElement('div');
newDiv.innerHTML = data;
divToInject.appendChild(newDiv);
}
function showNext() {
var i = activeIndex + 1;
if(i > aContent.length) {
i==0;
}
debugger;
document.getElementById('header').innerHTML = aTitle;
document.getElementById('content').innerHTML = aContent;
document.getElementById('date').innerHTML = aDate;
}
function showPrev() {
var i = activeIndex - 1;
if(i <= 0) {
i==0;
}
document.getElementById('header').innerHTML = aTitle;
document.getElementById('content').innerHTML = aContent;
document.getElementById('date').innerHTML = aDate;
}