<input class="c-search__textbox c-form__textbox" id="top-query" list="top-json-datalist" onkeyup="suggest(this)" autocomplete="off" type="text" name="q" value="" placeholder="Type something . . .">
<datalist id="top-json-datalist"></datalist>
function suggest(elem) {
if(elem.id == "query") {
document.getElementById("query").disabled = false;
var dataList = document.getElementById('json-datalist');
var input = document.getElementById('query');
} else if (elem.id == "top-query") {
document.getElementById("top-query").disabled = false;
var dataList = document.getElementById('top-json-datalist');
var input = document.getElementById('top-query');
}
var request = new XMLHttpRequest();
// Handle state changes for the request.
request.onreadystatechange = function(response) {
if (request.readyState === 4) {
if (request.status === 200) {
var data = JSON.parse(request.responseText);
var jsonOptions = data.hits;
dataList.innerHTML = '';
jsonOptions.forEach(function(item) {
var option = document.createElement('option');
option.value = item["query"];
dataList.appendChild(option);
});
}
}
};
request.open('GET','https://api.lite.s4p.jp/v1/suggest&query='+input.value,true);
request.send();
Как видите, я могу загружать элементы списка данных из вызова ajax.Я могу видеть элементы в выпадающем списке.Однако проблема заключается в том, что при выборе элемента раскрывающийся список остается.
Спасибо!