I have an table and an search field on page.\[code\]<input type="text" placeholder="Search..." id="search_query" value="" name="search_field" /><div id="dynamic_table" style="display: none;"><table width="100%" id="table" class="post_list"><tbody><tr> <th width="5%" align="left">No.</th> <th align="left">Name</th> <th width="13%" align="center">Action</th></tr></tbody></table></div><div id="static_table"><table width="100%" id="table" class="post_list"><tbody><tr> <th width="5%" align="left">No.</th> <th align="left">Name</th> <th width="13%" align="center">Action</th></tr><?php include("rows.php"); ?></tbody></table><br />Pages: <ul class="pagination"><?php echo $pagination; ?></ul></div>\[/code\]So there is two tables static with pagination and dynamic, which is invisible at the begining. An AJAX-controller returns not json encoded array, but html code using same rows.php which is used in static table.\[code\]$(function() {$( "#search_query" ).keyup( function(e) { if($(this).val() == "") { $( "#dynamic_table" ).hide(); $( "#static_table" ).show(); } else if($(this).val().length >= 3) { $( "#dynamic_table" ).show(); $( "#static_table" ).hide(); $.ajax({ type: "post", url: "/ajax_controller", dataType: "html", data: { term: $(this).val() }, success: function(data) { $( "#dynamic_table tr:not
first-child)" ).remove(); $( "#dynamic_table tr" ).after(data); } }); }});});\[/code\]The problem is following. Since it is asynchorouns requests and answers, they can be run and returned in different times. So while user typing search request there are made multiple AJAX-calls to controller and first call may be answered last and data in table will not match to search request. How to implement custom autocomplete style dynamic search control?
first-child)" ).remove(); $( "#dynamic_table tr" ).after(data); } }); }});});\[/code\]The problem is following. Since it is asynchorouns requests and answers, they can be run and returned in different times. So while user typing search request there are made multiple AJAX-calls to controller and first call may be answered last and data in table will not match to search request. How to implement custom autocomplete style dynamic search control?