Pristine and dirty shouldn't change between wizard pages.
See original GitHub issueAre you submitting a bug report or a feature request?
Bug report
What is the current behavior?
- Fill first and last name (
pristine
should change tofalse
) - Click next
pristine
back totrue
- Back to previous page
pristine
is stilltrue
What is the expected behavior?
pristine
and dirty
shouldn’t change between wizard pages.
or:
There should be other way, to check state of fields that are not currently in the DOM.
Sandbox Link
https://codesandbox.io/s/wizard-field-state-gfevw?file=/Wizard.js
What’s your environment?
n/a
Other information
I have multi-paged form (without validate
on each page) and I want to block submitButton, when nothing has changed.
Issue Analytics
- State:
- Created 3 years ago
- Reactions:7
- Comments:9 (1 by maintainers)
Top Results From Across the Web
difference between pristine/dirty and touched/untouched
$pristine / $dirty tells you whether the user actually changed anything, while $touched / $untouched tells you whether the user has merely ...
Read more >What's the difference between ng-pristine and ng-dirty in ...
ng-dirty: The ng-dirty class tells that the form has been made dirty (modified ) by the user. It returns true if the user...
Read more >Form marked as dirty after updating form contents to their ...
Any time I try to store a pristine, or original state, of the model in my scope, I get two-way bindings so that...
Read more >What a very bad day at work taught me about building Stack ...
I'm the new Director of Public Q&A at Stack Overflow. ... To kick off these changes, we started with the tools that our...
Read more >defi consulting group
The leader stepped forward. His white robe was less than pristine, smeared with dirty handprints and splotches of tar, but his eyes were...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
We ran into a similar situation, where we had some fields inside an accordion. When an accordion item is closed, its child components become unmounted, and therefore many of the
Field
components in the form become unmounted.Our app is required to automatically save the form when we leave the page, but only if the form is dirty. To do this, we check the
dirty
state of the form state. Because thedirty
state was getting reset back tofalse
when an accordion item was getting closed, the save was not occurring in these situations when it should have.Are there any recommendations to work around this issue? The best idea I could come up with was to track the
dirty
state ourselves. Which is unideal, because now we have two versions ofdirty
, and we need to ensure that future developers don’t use the wrong value.The way the Wizard is implemented it is keeping each page as a separate form, and the combining only the values in the parent component. This solves many problems like forcing validation when hitting “Next”, only marking the fields on the page as
touched
when validation halts submit, etc.You could potentially raise the
<Form>
component up into the parent and then do some sort of conditional validation for each page, but then you’ve got a whole myriad of other problems to deal with.No.