Missing characters in text box with onkeyup listener in Firefox

Question

I've got a text field that the user can use to search for items. There is an onkeyup listener attached that searches a database based on what has been entered. In Chrome this works very well, but in Firefox there is lag and fast typers will see missing characters in the text field. Is this a Firefox issue or is there a workaround for this?

To get the general idea of what I'm doing in the code I have something like this:

HTML

<input type="text" onkeyup="makeRequest()">

JS

function makeRequest() {
   var xmlhttp = new XMLHttpRequest();
   xmlhttp.open("POST", url + parameters, false);
   xmlhttp.send("#");
   return xmlhttp.responseText;
}

Answer 1

Maybe make it asynchronous and have some kind of control so as not to trigger it if one request is still ongoing. In that context, I think it would make more sense and also maybe solve your problem on Firefox.

Right now if someone types many letters quickly you're sending unnecessary requests anyway.

Like that:

//html file

<input type="text" onkeyup="makeRequest()">

//java script file

function makeRequest() {
  if(!req_called){
      req_called = true; 
      var xmlhttp = new XMLHttpRequest();
      xmlhttp.open("POST", url + parameters, true);
      xmlhttp.load = function(){
          req_called = false;
          return xmlhttp.responseText;

      }
      xmlhttp.send("#");

   }
}