I have a form, on the first 3 input fields (fname, lname, addr) there is an onkeyup function which checks the inputs value against a database. If there is a single match, the function offers a popup (javascript confirm) which asks if the record in the database is correct, if so will prepopulate the fields.
Problem is, most people can type faster than the function can check. If the function finds a match with "smi" but the users types "smith" before the pop up, then the confirm will appear 3 times consecutively.
What can be done about this?
Here's what I've tried, no luck
function startAjax(){
if(document.getElementById("flag").value == "yes"){
if (window.XMLHttpRequest){ xmlhttpp=new XMLHttpRequest(); }else{ xmlhttpp=new ActiveXObject("Microsoft.XMLHTTP"); }
xmlhttpp.onreadystatechange=function(){
if(xmlhttpp.readyState==4 && xmlhttpp.status==200){
var status = xmlhttpp.responseXML.getElementsByTagName('status')[0].firstChild.nodeValue;
var fname = xmlhttpp.responseXML.getElementsByTagName('fname')[0].firstChild.nodeValue;
var addr = xmlhttpp.responseXML.getElementsByTagName('addr')[0].firstChild.nodeValue;
var lname = xmlhttpp.responseXML.getElementsByTagName('lname')[0].firstChild.nodeValue;
var city = xmlhttpp.responseXML.getElementsByTagName('city')[0].firstChild.nodeValue;
var state = xmlhttpp.responseXML.getElementsByTagName('street')[0].firstChild.nodeValue;
var zip = xmlhttpp.responseXML.getElementsByTagName('zip')[0].firstChild.nodeValue;
var email = xmlhttpp.responseXML.getElementsByTagName('email')[0].firstChild.nodeValue;
document.getElementById("ajax_status").innerHTML=status;
if(status == "Found user"){
document.getElementById('pop_display').style.display = "block";
var confirmMsg = "*User Found*
Name: "+fname+" "+lname+"
Address: "+addr+"
City: "+city+"
State: "+state+"
Zip: "+zip+"
Email: "+email+"
Click 'OK' To populate fields or click 'Cancel' if this is not the correct info.";
var fillOrNot = confirm(confirmMsg);
if(fillOrNot === true){
document.getElementById('fname').value = fname;
document.getElementById('lname').value = lname;
document.getElementById('address').value = addr;
document.getElementById('city').value = city;
document.getElementById('state').value = state;
document.getElementById('zip').value = zip;
document.getElementById('email').value = email.trim();
document.getElementById('flag').value="no";
}else{
document.getElementById('flag').value="yes2";
document.getElementById("ajax_status").innerHTML="Aborted";
}
document.getElementById('pop_display').style.display = "none";
}
}
}
var param1 = document.getElementById('fname').value;
var param2 = document.getElementById('lname').value;
var param3 = document.getElementById('address').value;
var url = "https://www.mywebsite.com/ajaxhandler.php?fname="+param1+"&lname="+param2+"&addr="+param3;
xmlhttpp.open("GET",url,true);
xmlhttpp.send(null);
}
}