Hide rows where the title is missing

i have 2 queries loading data from an api (openstreetmap), i joined them and the data is correctly loading in a table with this js code
const bakeryChecked = checkBakery.value;
const restaurantChecked = checkRestaurant.value;

const bakeryData = bakeryChecked ? querybakery.data.features : [];
const restaurantData = restaurantChecked ? queryrestaurant.data.features : [];

const filteredData = [...bakeryData, ...restaurantData].filter(item => item.name !== null && item.name !== "");

return filteredData;

however, some rows have no title and i would like to hide/remove them
i tried with the filter .filter(item => item.name !== null && item.name !== "");
but these rows are still visible.
The column is called "title" and its id is title and it is loading data as {{ item.name }} in a string format.
How can i fix this?

checking for null / undefined / empty can always be tricky, in your case I think you could make the filter look for records that "have a title" eg this works for me:

[...[{title:"one",id:1},{id:2}], ...[{title:"",id:3},{title:false,id:4}]].filter(o => o.title);

1 Like

Hey @eldoland! Did @dcartlidge's solution work for you? :slight_smile:

Hi @victoria not really, but i was able to filter the data through the table filter

1 Like