input Search = includes keep returning Null

i’m trying to create a input search to search for certain values in a array of objects fetched from a certain API… but each time i use the java script code it returns null

const search_input = document.querySelector('.input_search')
function searchCharacter() {
    fetch(api)
    .then(function(e){
        return e.json()
    })
    .then(function(data) {
        let characters = [];
        characters.push(...data) 
        search_input.addEventListener('keyup' , (e) => {
        const input_string = e.target.value
        const filterSearch =  characters.filter( e => {
               return  e.name.includes(input_string)

        })
        console.log(filterSearch)
    })    
})}
searchCharacter();

if i switched e.name with e.short_name or e.shortnames[0] i works just fine , but i need for the function too look up the name since they are more readable this img of the structure of the array
enter image description here

38 thoughts on “input Search = includes keep returning Null”

Leave a Comment