Clear input fields after form posting

[simonmesmith]

First off, I love the idea and the execution. Clean, understandable, easy to use.

I have what's possibly a stupid question, however.

I cannot seem to find a way to clear fields after saving data.

For example, I have a form with fields like this:

pc.input(
   on_blur=State.set_title, placeholder="Title", width="100%"
)
...

I save the data and reset the attributes:

pc.button("Save Note", on_click=State.save_note, width="100%"),

...

    def save_note(self):
        with pc.session() as session:
            note = Note(
                username=self.username, title=self.title, body=self.body
            )
            session.add(note)
            session.commit()
        self.reset()

    def reset(self):
        self.title = ""
        self.body = ""

But the text remains in the input fields.

I tried setting the value attribute of input fields to state attributes, but then you can't change them via the UI, which makes sense as it's kind of circular logic.

Anyway, help appreciated. Thanks!

[picklelo]

Thanks for trying it out!

To do this, I would recommend setting the value field and combining it with the on_change trigger (instead of the on_blur).

pc.input(
   value=State.title,
   on_change=State.set_title,
)

Then your reset handler should work as expected.

This method has the disadvantage that it will now make a network call on each keystroke rather than only on the final blur. We will look into a way to make this more performant since it's such a common use case.

[simonmesmith]

Sounds good, thanks!

Maybe:

• An option to only set the state when the button gets clicked
• A keystroke delay on on_change so it doesn't happen until the user stops entering text for a few seconds