Two filters on page bound to models, only update on button press

What seems to be the problem:

On a page I have two dropdown selects, and they are dependant. The code is very much based on this example:
https://talltips.novate.co.uk/livewire/dynamic-cascading-dropdown-with-livewire

The default behavior of Livewire is to update (filter) the second select when the first select is changed. A compound table is then output display the results when this happens.

I would prefer to not have the compound table display as changes are made, but rather have a “Refresh” button. The reason is the filter needs to be work in tandem and real-time changes do not make sense.

Steps to Reproduce:

  • Create two dependant dropdowns.
  • Create a @foreach loop table on a page which will display data based on selected dropdowns
  • Table changes all the time as dropdowns change

Expected Behavior

  • Table doesn’t chance every time but rather only when a button is pressed

Are you using the latest version of Livewire:

Yes

Do you have any screenshots or code examples:

Unfortunately nothing public but if my question isn’t clear then I’ll see if I can publish an example somewhere.

Try to make the table as a separate component, then it will not be refreshed. Dropdown choices you may pass to table component as an event.