search bar is added but data not fetching in selectize jquery and at the normal side are working fetch data option tag but after adding search bar in drop down it can not working so please help
This is the simple version of your task. So may be it will helpful for you:
let url = 'https://rickandmortyapi.com/api/character/?page=1';
let isOpen = false;
const select = document.querySelector('#characters');
const getCharacters = (isFirstRun) => {
if (!isFirstRun) {
isOpen = !isOpen;
if (isOpen) return;
}
fetch(url)
.then(response => response.json())
.then(charactersData => {
url = charactersData.info.next;
select.innerHTML = '';
return charactersData.results.map(charactersData => charactersData.name);
})
.then(charactersNames => charactersNames.forEach(characterName => {
const option = document.createElement('option');
option.innerText = characterName;
select.appendChild(option);
}))
.catch(e => console.log(e.message));
}
getCharacters(true);<select id="characters" onclick='getCharacters()'></select>You can use an input with datalist.
https://developer.mozilla.org/de/docs/Web/HTML/Element/datalist