How to clear filter reusable element visually and repopulate the inputs from custom states later

I have a question about clearing the inputs in the filter usable element. I use custom states to save the value of the inputs. When I click the update button, the input values are saved in the custom states so they can use by the parent’s repeating group to filter the result.

How do I clear the inputs in the filter and remember the inputs when I come back? There are 2 options. Both have a problem.

Option 1

The initial values of the inputs are blank. The clear button clears the input by doing a reset to the inputs’ initial values. It doesn’t update the custom states.

Problem In the filter, I set an input and click update. The label is now Filter (1). I come back to the filter. The input is blank. It should not. The input should have a filter value. How can it be populated with the value from the custom state?

Option 2

I set the initial values of the inputs to be from the custom states, initially blank. I set an input and click update. Filter label shows Filter (1). When I come back to the filter, the input is populated from the custom states.

Problem I click the clear button which does a reset, but the input keeps its initial value from the custom states and won’t clear. So how can I clear the inputs “visually” without updating the custom states?

Hello @tim

Using custom states to pass values from a reusable onto a page is sound. Only shortfall is that when a user refreshes the page the customs states are emptied.

As for dealing with clearing or not inputs and clearing or not custom states I hope the following comments may help:

Inputs

  • You can apply a default value
  • You can apply conditional values that can act as default values
  • You can clear them with the action reset input when. Just use “when it is not empty” for each of the inputs and you will see that things will work. Even if you have 10 inputs you can use 10 actions … one for each.
  • You can display data to them through actions but not on the input. You can place an input inside a group and display the data to the group via an action and have the input’s value feed from this parent group.

Custom states

  • You can apply default values but not conditional default values. This is where Airdev’s technique of using groups or repeating groups to handle page data works better than custom states.
  • To populate via actions you can set the state to a value … or just set the state empty and it will clear the custom state value

Suggestion

If I understand well what you want to accomplish which is to clear the inputs and to remember them when you come back. It seems that you want to clear and remember at the same time. I guess what you want to do is to have default values … so … set them as needed and add conditions if so.

Is this what you needed? Please let me know. :smiley:

1 Like