Yahoo Autocomplete results sometimes show old query

Question

Hi all,

I'm using Yahoo Autocomplete with a remote php database request and zero time delay. The problem is that sometimes the results from an old query come back after the most recent query.

So far example if im searching for beginner, sometimes the results from 'beg' will override the most recent result in the autocomplete dropdown if that query takes the longest to return from the server.

I've tried aborting the old queries but that slows down the user experience as they do not get a server request until the last keystroke.

I was wondering if there is a way to order the queries that return? To make sure that the server response from the most recent query displays

Thanks in advance David

Answer 1

You can add some id on every query then resend that id from the server to the client, and compare that received id to the current request id.

Or perhaps abort old queries, if the API allows you to do so.

Answer 2

Any chance of some help on the sequencing? My Yahoo autocomplete code is currently as below, I want to avoid doing the cancel stale requests.

<script type="text/javascript">                

          YAHOO.example.autocomplete = function() {


            // instantiate remote data source
            var oDS = new YAHOO.util.XHRDataSource("../employer/post-job/get_towns.php"); 
            oDS.responseType = YAHOO.util.XHRDataSource.TYPE_XML; 
            oDS.responseSchema = { 
               resultNode: 't', 
               fields: ['n']             
            }; 
            oDS.maxCacheEntries = 100;
         // oDS.queryMatchSubset = true;   
         // oDS.connXhrMode = "cancelStaleRequests";


            // instantiate YUI autocomplete widgets

            var oAC0 = new YAHOO.widget.AutoComplete("input1", "inputcontainer", oDS);  
         oAC0.minQueryLength = 3; 
         oAC0.queryDelay = 0.05;    
         oAC0.maxResultsDisplayed = 10;

            return {
                oDS: oDS,
                oAC0: oAC0

            };
          }();
         </script>