saas-ui icon indicating copy to clipboard operation
saas-ui copied to clipboard

Select inside form does not update state on first change

Open benmcginnis opened this issue 8 months ago • 2 comments

Description

When using a 'select' field type inside a form with a<SubmitButton disableIfUntouched disableIfInvalid>{'Update'}</SubmitButton> , changing the select doesn't change the form state the first time you do it. You have to change the select again before the submit button is enabled.

Link to Reproduction

https://codesandbox.io/p/sandbox/gracious-sky-4xfg92?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clxdk04xv00063b6gkopidutx%2522%252C%2522sizes%2522%253A%255Bnull%252Cnull%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clxdk04xv00023b6gm793p8ke%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clxdk04xv00033b6glod3kexh%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clxdk04xv00053b6gncopdkw5%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clxdk04xv00023b6gm793p8ke%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clxdk04xv00013b6gc979nb7k%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fsrc%252Findex.tsx%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%255D%252C%2522id%2522%253A%2522clxdk04xv00023b6gm793p8ke%2522%252C%2522activeTabId%2522%253A%2522clxdk04xv00013b6gc979nb7k%2522%257D%252C%2522clxdk04xv00053b6gncopdkw5%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clxdk04xv00043b6gigpazbyw%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522id%2522%253A%2522clxdk04xv00053b6gncopdkw5%2522%252C%2522activeTabId%2522%253A%2522clxdk04xv00043b6gigpazbyw%2522%257D%252C%2522clxdk04xv00033b6glod3kexh%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clxdk04xv00033b6glod3kexh%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Afalse%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

Steps to reproduce

  1. Change the Select to another value
  2. See that the submit button is still disabled
  3. change the select value again
  4. see that the submit button is now enabled

Saas UI Version

2.5.8

Chakra UI Version

2.8.2

Browser

Google Chrome 125

Operating System

  • [X] macOS
  • [ ] Windows
  • [ ] Linux

Additional Information

No response

benmcginnis avatar Jun 13 '24 18:06 benmcginnis