PHP gevorderde |
|
Momenteel heb ik een script die een adres aanvult via autocomplete. Dit adres wordt gevormd via een ajax call.
Echter zijn er geen realtime resultaten. Het is pas als ik stop met typen, dat er suggesties weergeven worden. Qua resultaten is dit uiteraard correct.
Echter heb ik zo nooit echt het nut van automatisch aanvullen. De bedoeling is dat er resultaten getoond worden van zodra er 2 tekens zijn. Bij de eerste call vraag ik 30 mogelijkheden op.
De bedoeling is dus om op elk moment iets te tonen (en eventueel wat te werken met een cache die bij een nieuwe keydown aangepast wordt).
Ik heb wel een idee hoe ik zou moeten werken, maar krijg het niet omgezet in code.
Voorlopig heb ik dit:
$( "#straat" ).autocomplete({
source: function( request, response ) {
$.ajax( {
url: "http://loc.geopunt.be/geolocation/suggestion",
dataType: "jsonp",
data: {
q: $("#straat").val() + ", "+ $( "#gemeente option:selected" ).text(),
c: 30
},
delay: 0,
success: function( data ) {
cleanArray = [];
$.each( data.SuggestionResult, function( key, value ) {
var newaddress= value.substr(0, value.indexOf(','));
cleanArray.push(newaddress);
});
response(cleanArray);
}
});
},
minLength: 2,
select: function( event, ui ) {
console.log( "Selected: " + ui.item.label );
}
}).focus(function() {
$(this).autocomplete("search", $(this).val());
});;
$( "#straat" ).keydown(function() {
console.log( "RESULTATEN TONEN?" );
});
$( "#straat" ).autocomplete({ source: function( request, response ) { $.ajax( { url: "http://loc.geopunt.be/geolocation/suggestion", dataType: "jsonp", data: { q: $("#straat").val() + ", "+ $( "#gemeente option:selected" ).text(), c: 30 }, delay: 0, success: function( data ) { cleanArray = []; $.each( data.SuggestionResult, function( key, value ) { var newaddress= value.substr(0, value.indexOf(',')); cleanArray.push(newaddress); }); response(cleanArray); } }); }, minLength: 2, select: function( event, ui ) { console.log( "Selected: " + ui.item.label ); } }).focus(function() { $(this).autocomplete("search", $(this).val()); });; $( "#straat" ).keydown(function() { console.log( "RESULTATEN TONEN?" ); });
Ik zocht al wat rond op het net maar het is allemaal zonder JSON call.. En ik merk dat deze maar uitgevoerd wordt bij een ms stoppen van typen. En zolang dit niet gebeurd, is er ook niets om te tonen.
EDIT: Ik denk dat ik volledig in de verkeerde richting bezig ben en die autocomplete moet loslaten.. Ik kwam namelijk chosen tegen. Als ik kan werken met een dynamische dropdown is mijn probleem opgelost.
https://harvesthq.github.io/chosen/
|