react-component / react-component/field-form

Controlled form?

Open
#420 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
1k
Forks
286
Avg merge
4d 16h
Merged PRs (30d)
1

Description

I have a use case where we're embedding the form inside a modal. The modal will control the form... namely:

  • the modal submit button needs to be disabled while the form is invalid
  • after pressing the modal submit button, we need to wait for the form to finish submitting

What is the recommended approach?

  • It seems that we can use form.getFieldsError() can be used to disable the modal button. It seems that this can be used but we have to also update the modal-button disabled state on every validation change
  • However, it seems that waiting for form submission is a bit awkward since form.submit() returns void (so we'd have to stitch together this call with the form onFinish handler)

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the form API entry points named in the issue: getFieldsError(), submit(), and the onFinish handler. Determine whether the project should provide a supported way to track validation state and await submission from an external modal; done means the controlled-form workflow is clearly defined and covered by the relevant tests.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.