How to customize listview search filter with remote data load
I want to tune listview filter to let all values founded on remote server be displayed, not only that exactly match searching string. (e.g. my remote search returns 3 results for request 'NewYork' all starts with 'New York', but listview search returns no results because of no backspace in search query)
$("#start-autocomplete").on("filterablebeforefilter", function (e, data) { e.preventDefault(); var $ul = $(this), $input = $(data.input), value = $input.val(), html = ""; $ul.html(""); if (value && value.length > 2) { $ul.html("<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>"); $ul.listview("refresh"); myremoteURL.suggest($input.val()).then(function (items) { $.each(items, function (i, itm) { html += "<li>" + itm.displayName + "</li>"; }); $ul.html(html); $ul.listview("refresh"); $ul.trigger("updatelayout"); }); } });
I tried to start from JQM Demo code, but it don't works for me.
$( document ).one( "mobileinit", function() { $.mobile.filterable.prototype.options.filterCallback = function( index, searchValue ) { //guess this code take no effects in case of using filterablebeforefilter } });
Is there any way to make search filter not to filter results that returned from remote server?