I'm building a an AJAX loader for RSS news feeds. I'm running into a basic JS error but i'm not understanding why. It's an uncaught typeError: cannot read options property of null.
Here's my code, let me know if there's something you see in my event handlers or my JS.
HTML:
<label for="feeds">Select A News Feed</label>
<select id="feeds" name="feeds">
<option value="Yahoo">Get Yahoo News Top Stories</option>
<option value="CNN">Get CNN Arabic Top News</option>
<option value="BBC">Get BBC World Video and Audio</option>
<option value="Figaro">Get Le Figaro Politique Stories</option>
</select>
<br/>
<label for="items">Number of Items Displayed:</label>
<select id="items" name="items">
<option value="3">3</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
<br/>
<button onclick="return readrss.doxhr('newsContainer1', readrss.feedUrl)" id="button">Get News</button>
<br/>
<div id="newsContainer1">
</div>
JS:
var itemSelect = document.getElementById("items");
var feedSelect = document.getElementById("feeds");
readrss = {
timeOutDuration: 2,
toolong: false,
doxhr: function (container, url) {
readrss.numOfItems= itemSelect.options[itemSelect.selectedIndex].value; //get number of items to display
readrss.feedUrl = feedSelect.options[feedSelect.selectedIndex].value; //get URL from selected value
if (!document.getElementById || !document.createTextNode) {
return;
}
readrss.outputContainer = document.getElementById(container);
if (!readrss.outputContainer) {
return;
}
var request;
try {
request = new XMLHttpRequest();
} catch (error) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (error) {
return true;
}
}
request.onreadystatechange = function () {
if (request.readyState == 1) {
readrss.toolong = window.setTimeout(
function () {
if (request.readyState == 1) {
readrss.timedout = true;
request.abort();
readrss.outputContainer.innerHTML = 'The request took too long';
}
},
readrss.timeOutDuration);
readrss.outputContainer.innerHTML = '<img src = "indicator_medium.gif" alt = "loading" />';
}
if (request.readyState == 4 && !readrss.timedout) {
window.clearTimeout(readrss.toolong);
if (/200|304/.test(request.status)) {
readrss.retrieved(request);
} else {
readrss.failed(request);
}
}
};
request.open('get', '../loadrss.php?url = ' + encodeURI(readrss.feedUrl));
request.setRequestHeader('If-Modified-Since', 'Wed, 05 Apr 2006 00:00:00 GMT');
request.send(null);
return false;
},