Comments (6)
@Lonli-Lokli that's quite an old version of Blueprint; can you repro the issue with the latest versions of those libraries? It's unlikely that a bug will get fixed in datetime2 v0.x
from blueprint.
@adidahiya Actually it's easy reproduced with new version too, because code is almost the same https://codesandbox.io/p/sandbox/blueprintjs-datetime2-forked-99zpqw?file=%2Fsrc%2FApp.tsx%3A55%2C13
Could you please also provide a workaround for v5? I hope I will port it in my v4 project too.
from blueprint.
@Lonli-Lokli thanks for updating the sandbox. I don't see how you are storing a "previous value" to be restored. As for reporting the value twice, I think you could easily work around that by checking if newDate === dateValue
in the change handler?
from blueprint.
@adidahiya Let me first describe my real issue.
Scenario 1
User opens popover by click, then select the date via datepicker - he can select all the allowed values, no issues, we send new date to the API.
Scenario 2
User opens popover by click, then manually starts to enter the date. Here we have a first problem - any date-like value eg '2024' will be handled by date libraries (date-fns or dayjs) as correct, new value will be send to onChange with isUsermodified=true and send to API.
I could workaround this problem with expecting specific length of input
Scenario 3
User opens popover by click, then manually starts to enter the date, entering 2024-01-19. We parse this value as valid and send it to the API. But in order to finish the value (and close the popup) the natural behaviour for web user is to press Enter. Unfortunately, this Enter will second onChange event (while it close the popup)
Scenario 4
User opens popover by click, then manually starts to enter the date, entering 2024-01-19, then pressing Esc (not Enter). this is common for any popovers - you might want to open the control, click & select something but later decide to revert your changes by pressing Esc. Unfortunately it does not happen.
Both Scenario 3 and Scenario 4 could be handled with new event onSubmitted (it should happen with closing popup too). I still hope that if you go with this route you will backport this to v4
So now, answering your question, I do not save anywhere previous value as I dont need them but expecting to get always valid last-submitted from Control.
Re: checking if dates are the same - again, with this approach when onChange is fired on any input it's kind of hard to predict when to revert
from blueprint.
There isn't really a concept of "submitting" in most Blueprint form components. They are very low-level components that have state, and any modification changes that state immediately. This is because they are not meant to be submitted as they are modified. There are some specialized components (like EditableText
) that support this UX, but DateInput is not one of them. The expectation for these components is that state is stored, and eventually sent off when the form is submitted.
from blueprint.
Please remember that components might be used outside of any form, so you can name this property as onApplied.
I don't get why you are disagree with the fact that any user input has several states - initial, editing, saved, and each state might be valid and invalid.
from blueprint.
Related Issues (20)
- Sort by clicking on the table header only
- Add `leftElement` support to `DateInput3`
- InputGroup & react-hook-form HOT 2
- Select has a horizontal scrollbar
- Overlay2 enforceFocus steals focus away from other components on close
- .bp5-popover-target inside label.bp5-label given unnecessary 5px top margin
- Change or manage shortcut dialog shortcut
- Blue artifact line displayed when selecting table cell in the first row and scrolling down
- Additional property for `SectionCard` component HOT 1
- FormGroup sub label colour diverges from helper text in dark theme, has low contrast
- Is it correct for the FormGroup sub label colour to be determined by the intent?
- DialogFooter children width is unconstrained
- data-cy Attribute Not Appearing in <PhoneField> React Component HOT 1
- [BUG] Icon intent ignored in <Dialog/> title
- NumericInput: clampValueOnBlur doesn't allow to HOT 1
- `useOverlayStack()` - `Array.at` incompatible with older browsers (Safari 15.3, older) HOT 1
- Checkbox component title attribute doesn't work! HOT 1
- DateInput3 showing the wrong date HOT 2
- `React.JSX.Element` type in select `ItemRenderer` type is not compatible with`@types/react` < 18.2.6 HOT 2
- Slider fill with negative min, positive max, initialValue of 0 has the wrong track fill at zero
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from blueprint.