In this episode, we dive into an easy-to-miss (but super frustrating) issue when working with forms in single page applications, especially when using Inertia.js. We notice that if you start typing into a form and navigate away, your input vanishes when you come back—unlike typical, non-SPA websites where the browser remembers your form contents.
We walk through why this happens: because each page change in Inertia is actually a request that completely re-renders the page component, wiping out the local form state. It’s a bit of a bummer for users who accidentally leave the page and lose what they wrote.
The good news? Inertia ships with some handy tools for remembering state, especially the useRemember
composable. In particular, we update our form code to use a key when initializing the form helper, which tells Inertia to hang on to our form data between page changes. This means when you come back to the page, your carefully crafted message is still right where you left it.
We finish by showing this in action: typing in the form, navigating away, and coming back to see the message preserved—just like magic! It's a simple tweak that brings back a more standard app feel, and shows how easily Inertia can help smooth out the rough edges of building SPAs.