Beginnerprogrammer Beginnerprogrammer - 6 days ago 6
React JSX Question

Javascript create filter for gallery

I am working on a filterable gallery, but now It is only showing the right image when the whole title matches the input value. But I want to filter on seperated letters. Here I wrote a function: `

filterList (filterText) {
var updatedList = this.props.array;
return updatedList.filter(function(item){
var split = item.name.split("");
console.log(split, filterText);
return split === filterText;
});
}


Now it show me the seperated item.name like this:
["p","h","o","t","o","","1"]

Instead of Photo 1 I want to filter on seperated letters.

Here is a link to the codePen: LINK
`

Answer

One way is to compare the input value with a substring of the whole title that has the same length. Here is an example:

filterList (filterText) {
    var len = filterText.length,
        updatedList = this.props.array;

    return updatedList.filter(function(item){
        var split = item.name.slice(0, len);
        console.log(split, filterText);
        return split === filterText;
    });
}
Comments