There is a autocomplete textbox in classic ASP. Minimum length is set to 4 but it is very slow the autocomplete list returns more than 500 records.
log in console returns expected result and if less than 500 rows, correct list is returned in autocomplete textbox.
If I want to load more data while scrolling instead of loading the page, what would be the best method?
$(document).ready( function(){
var availableCode = new Array();
var strCode = "";
<%
Dim idxJs
for idxJs = 0 to UBound(CodeList)-1
%>
availableCode[<%=idxJs %>] = unescape('<%= Escape(CodeList(idxJs)) %>');
<% next %>
function customFilter(array, terms) {
arrayOfTerms = terms.split(" ");
var term = $.map(arrayOfTerms, function (tm) {
return $.ui.autocomplete.escapeRegex(tm);
}).join('|');
var matcher = new RegExp("(?![^&;]+;)(?!<[^<>]*)("+term+")(?![^<>]*>)(?![^&;]+;)" , "i");
return $.grep(array, function (value) {
console.log("result - " + matcher.test(value.label || value.value || value));
console.log("value - " + value)
return matcher.test(value.slice(0, 10));
});
};
$( "#frmCode" ).autocomplete({
multiple: true,
mustMatch: false,
minLength: 4,
delay: 100,
search: function (event,ui) {
window.pageIndex = 0;
},
source: function (request, response) {
response(customFilter(
availableCode, request.term));
}
});
} );
<%@ Language=VBScript %>
<%
Response.buffer=true
Response.Expires = -1
Response.ExpiresAbsolute = Now() -1
Response.CacheControl = "no-cache"
Response.AddHeader "cache-control", "private"
Response.AddHeader "Pragma", "no-cache"
%>
For the matcher, I made a change to the below.
var matcher = new RegExp("" + term, "i");
I also added "slice" to show only the top 100. This made a significant performance improvement on this issue.
$( "#frmCode" ).autocomplete({
multiple: true,
multipleSeparator: " ",
mustMatch: false,
minLength: 2,
search: function (event,ui) {
window.pageIndex = 0;
},
source: function (request, response) {
response(customFilter(
availableCode, request.term).slice(0, 100));
}
Thank you to everyone for the advice!