Code Monkey home page Code Monkey logo

Comments (11)

almet avatar almet commented on May 2, 2024

Sure! Do you want to work on a patch?

from react-jsonschema-form.

cedricmessiant avatar cedricmessiant commented on May 2, 2024

Yes, of course. It should be just as simple as to replace : <p><button type="submit">Submit</button></p> by { children ? children : <p><button type="submit">Submit</button></p> } (I just tested it). I may also add a test and some doc in README.md if this solution is OK for you.

from react-jsonschema-form.

n1k0 avatar n1k0 commented on May 2, 2024

It should be just as simple as to replace

We'll need to expose the submit, change and error handlers so children can leverage them as well.

from react-jsonschema-form.

cedricmessiant avatar cedricmessiant commented on May 2, 2024

I use onClick handlers on children buttons (and I need to save formData on my parent component's state to be able to pass it to these handlers). It's mostly because I don't know if it is possible to know which submit button was clicked in the handleSubmit handler...

from react-jsonschema-form.

n1k0 avatar n1k0 commented on May 2, 2024

I use onClick handlers on children buttons

I don't get it, so how do you get form validation?

from react-jsonschema-form.

cedricmessiant avatar cedricmessiant commented on May 2, 2024

In my use case, the form validation is made on the server side and for some buttons (e.g. a Cancel button), we don't want form validation). I agree it is an exception and we need to be able to validate the form in each button.

What do you mean by

expose the submit, change and error handlers so children can leverage them as well

?

from react-jsonschema-form.

n1k0 avatar n1k0 commented on May 2, 2024

I'm just realizing that adding a button type=submit is enough to trigger the form submission, which triggers the validation anyway. So yeah, just being able to pass a submit button as a children is enough. Nice.

Could you take care of working on a patch?

from react-jsonschema-form.

cedricmessiant avatar cedricmessiant commented on May 2, 2024

The problem is that form validation happens after the click event on the button. Then I tried to set some flag in the state of my parent component and to use this flag in the onSubmit handler but when I do this, the values in my fields "dissapears" and so the validation fails. It's strange that setting the state on my parent component can have an effect on the fields... So maybe it's not a good idea to have multiple submit buttons.

I can work on the patch though. It will be useful to allow users to use their own markup for buttons instead of the default submit button.

from react-jsonschema-form.

n1k0 avatar n1k0 commented on May 2, 2024

Fixed by #34

from react-jsonschema-form.

maneeshbhunwal123 avatar maneeshbhunwal123 commented on May 2, 2024

I was not able to make the above solution work,
My use case is,
I want 2 submit buttons on my form. onclick of them, separate flows will be kicked in but both of them need the formdata, I tried the above approach but my non default button's onclick/onsubmit handler is not getting data. Is this feature currently supported?
Please help

from react-jsonschema-form.

llamamoray avatar llamamoray commented on May 2, 2024

@bhunwal please see the "Validate and submit form from external control" example in tips and tricks

from react-jsonschema-form.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.