Desiring an autocomplete feature for an input box that displays results in a div below it, I wrote this shortened code. It functions flawlessly on Chrome and Firefox - when searching for "Eggs" and then "Milk", their respective results appear. However, Internet Explorer (IE) only processes the initial request successfully; subsequent requests do not trigger any output.
The network analysis reveals that IE indeed sends the subsequent requests to the server with a 200 header code. Nonetheless, it fails to act upon the received data.
Just to note, jQuery cannot be utilized due to platform restrictions, but YUI3 is allowed.
/* Initializing Ajax */
function ajaxRequest(){var activexmodes=["Msxml2.XMLHTTP", Microsoft.XMLHTTP"],i;if(window.ActiveXObject){for(i=0; i<activexmodes.length; i++){try{return new ActiveXObject(activexmodes[i]);}catch(ignore){/*suppress error*/}}}else if (window.XMLHttpRequest){return new XMLHttpRequest();}else{return false;}}
/* Accessing search value */
var searchBoxObj = document.getElementById('searchBox-1');
/* Ajax Request Handler */
var theSearchValue;
var mygetrequest=new ajaxRequest();
mygetrequest.onreadystatechange=function(){
if (mygetrequest.readyState==4){
if (mygetrequest.status==200 || window.location.href.indexOf("http")==-1){
var jsondata=JSON.parse(mygetrequest.responseText), /* retrieving result as JavaScript object */
searchData = jsondata.searches,
i;
if (searchData.length > 0){
document.getElementById('result').className = "on";
output='<ul id="searchResults">';
for (i=0; i < searchData.length; i++){
/* Loop Code Implementation */
}
output+='</ul>';
}
else {
document.getElementById('result').className = "";
}
document.getElementById("result").innerHTML = output;
}
else{
/* alert("An error has occurred while making the request") */
}
}
};
/* Triggered with each key press */
var stoppedTyping;
searchBoxObj.onkeyup = function() {
if (stoppedTyping) { clearTimeout(stoppedTyping);}
stoppedTyping = setTimeout(function(){
if (searchBoxObj.value.length > 2){
theSearchValue = searchBoxObj.value;
mygetrequest.open("GET", "/asp/lookup.asp?term="+theSearchValue, true);
mygetrequest.send(null);
}
}, 200);
};