0

I have 2 questions,

  1. How can I set the value of the global search box and trigger the filter programmatically, using java script (basically I want to implement a persistent filter, based on the last user input, as the user navigates in and out of the page), check image below

enter image description here

  1. Considering the Veu devtool component, I can find the vue-good-table Component and its Search subcomponent. And I can see that there is a value propuerty on this subcomponent that has the same value I had typed in the search box.

So my question is if with this information can I have a way to solve my first question, does the information in the Vue devtool can help me figure out the references to that object and value and then set it?

This could be a very useful tool in case I have a similar problem in the future with another component.

Have very little experience with Veu and general searches on how to access data or elements in components has been confusing, I just understand the properties and events to pass data, but in this case this is an imported component, so I can not hack it.

hanspr
  • 9
  • 1
  • `vue-good-table` is decently documented, no need to hack it. I suggest giving [searchFn](https://xaksis.github.io/vue-good-table/guide/configuration/search-options.html#searchfn) a try. – tao Nov 07 '22 at 04:18

2 Answers2

0

Thanks @tao, I read the docs before but skipped noticing this property

externalQuery

This is the one that solves the problem, you can link a variable to the search item and I then use your own text input box to implement the solution.

hanspr
  • 9
  • 1
0

I found a nice way to do this, the question is a little bit old but just in case anyone is searching for a solution to this, set a ref like

<VueGoodTable ref="my-table">

and you can update the search box like this:

this.$refs["my-table"].globalSearchTerm = 'whatever you want';

P.S.: This won't trigger the search though

andreycwb
  • 21
  • 5