I am learning with V4.1.0.3
In Trying to do an autocomplete in a form on admin side
Everything is going well to the step I have the correct JSON response.
I can even see JQuery building the list string while stepping inside
But then the list result is not displaying back in my input field...
Any idea that could push me in the good direction ?
Thanks for any suggestion ...
Code: Select all
<form method="post" action="{{ start_url }}" class="d-flex align-items-center gap-2">
<label for="input-model" class="form-label">Model</label>
<input type="text" name="filter_model" id="input-model" value = "" class="form-control" data-oc-target="autocomplete-model" autocomplete="off" placeholder="Model..." style="width: 300px;">
<button type="submit" class="btn btn-primary">{{ start_button }}</button>
</form>
....
$('#input-model').autocomplete({
source: function(request, response) {
$.ajax({
url: '{{ autocomplete_url }}&filter_model=' + encodeURIComponent(request),
dataType: 'json',
success: function(json) {
console.log('Autocomplete AJAX response:', json);
//console.log(item['model']);
response($.map(json, function(item) {
return {
label: item['product_id'],
value: item['model'],
};
}));
},
error: function(xhr, status, error) {
console.error('AJAX Error:', status, error);
console.error('Response Text:', xhr.responseText);
}
});
},
select: function(item) {
//$(this).val(item['label']);
$('#input-model').val(decodeHTMLEntities(item['label']));
//$('#input-manufacturer-id').val(item['value']);
}
});
