Dynamic Form Validation (advanced)#

Form validation is a common task, and TwinSpark allows to consolidate validation logic on the server. Surprisingly, it could be difficult, but ts-swap="morph" strategy allows us to just return whole new form with errors and not mess up with focus.

Important bits

• Inputs have an id attribute - so that morphing algorithm can find them reliably.
• POST body contains <input type="submit">'s value - this way backend distinguish submission and validation.
• keyup updates form on every character input and it feels natural - morph algorithm skips currently focused element so that state is intact.