How to perform text search on a ListView using `Run script` of textInput?

App Building
1

I want to implement text-search for a ListView.
And I don't want to use Tramsform or SQL because the app call too much APIs for retrieving data.

So I used Event Handler of textInput and run the code below when the value of textInput changes.
But the problem is it didn't change the content of the listView on screen.

function transformData(data) {
  const searchText = textInput1.value;
  // Perform text search transformation on data
  
  const data_filtered = []
  
  data.forEach( obj => {
    const obj_text = JSON.stringify(obj)
    
    if (obj_text.includes(searchText)){
      data_filtered.push(obj)
    }
  })  

  return data_filtered;
}

const data = listView1.data;
const new_data = transformData(data);

listView1.data = new_data

What is wrong?

Thnak you in advance.

2

Hi @Yoji_Yamamoto, welcome to the forum! :wave:

listView.data is read-only. That is why listView1.data = new_data won't work. The way to do this is with a Transformer. Unlike a Resource query, the Transformer won't call the API unless you trigger it from there. You should be able to filter the data from the results of your query by doing something like: query1.data.filter(obj => obj === searchInput.value) , where "query1" is the "Resource query" and "searchInput" is the text input component you are using to filter. Then, use this "Transformer" as the "Data source" for your "List View" component.

query.trigger will make a request, but query.data will just retrieve data that has already been pulled.