React-jsonschema-form: Don't display submit button

[dreadheadsic]

Right now the only way to not display submit button is to provide children to the form, so when i want to skip the submit button and submit form programatically i pass empty fragment as a children to the form. Should there be an option to skip rendering submit button?

[epicfaace]

Sure, would accept a PR that adds an option to do that -- it would be kind of in the same vein as #1093.

[dreadheadsic]

Cool, i'll see what i can do.

[erhuz]

I would really need this feature! :+1:
Any update @dreadheadsic ?

[sbusch]

Altough we hide the submit button, too, I'm against adding features if aren't really necessary. So I personally would vote against an additional prop like hideSubmitButton just for hiding the button. Alternative to an empty fragment is passing null to children, Form can then be self-closing:

<Form
  // ...
  children={null} // hide the submit button
/>

Could be added to the FAQ.

But I'm fine with having a new prop, e.g. submitButton as an alias for children, to make the API clearer. Note: there may be a value for submitButton and children.

To have an additional benefit, this could be extented into support for passing functions (render prop).

[dreadheadsic]

@sbusch passing children={null} will not hide submit button.

[sbusch]

@dreadheadsic yes, you're right. Don't know why my test was successful...

Passing children={true} should do the job.

[dreadheadsic]

@sbusch haha, i see, yet another hack. That just doesn't feel right. What would you think if you're looking at some code and find component that says children={true}?
And aliasing children as submitButton, really?

[epicfaace]

What was wrong with passing in an empty fragment as a children to a form, again? It does look intuitive when someone reads the code.

Aliasing children as submitButton _might_ work, but rather than as a prop, it might be good to put it as part of an overall generic theme configuration as I detailed in https://github.com/rjsf-team/react-jsonschema-form/issues/1222#issuecomment-511054781

[dreadheadsic]

Now that's a good question. I don't mind passing empty fragment as a children, and it does indeed looks intuitive. Thing is that it's not so clear in docs how to do this, so at least documenting this so it's easy to find will be enough.

[mirajp]

Suggestion: if the onSubmit property is not specified, it should hide the submit button. That seems like the most direct thing to do as a user. This is how I control the custom children buttons for my rjsf wrapper and I haven't come across a downside to this approach yet.
Precedence: if you do not want to subscribe to the change events as a user types in values, you simply don't set the 'onChange' property on the Form.

[vidjuheffex]

Yes, but you still may might want to have an onSubmit AND not display the button.

(i.e. rely on enter press or programmatic use only)

The two most sensible options I see are adding a prop: 'hideSubmitButton' (I think the best approach _would_ be to hide it, so all accessibility behavior is retained), or having the submitRow be a field and submitButton be a widget that can be customize using the same intuitive system that exists for all other widgets.

I imagine most people are disabling simply because it's not where they want it and it can be easier to hide it then to css your way to the goal.

[zhaoyao91]

<Form>
  <Fragment />
</Form>

[jacqueswho]

@epicfaace I was just about to log an enhancement regarding the submit button. was thinking we have submitButtonProps to give options. This includes hiding, changing text, shape, use icons. I see some of the themes are creating their own submit button as children. But because no props are being passed down to the children, the themes cant make use of the hide or change text props. This also allows for later other optional props related to the submit button.

[epicfaace]

@jacqueswho yeah, submitButtonProps sounds like a good idea -- perhaps we call it ui:submitButtonProps?

[jacqueswho]

@jacqueswho yeah, submitButtonProps sounds like a good idea -- perhaps we call it ui:submitButtonProps?

@epicfaace yes, was thinking the same thing. so just need to agree on options to pass. Is this already logged somewhere else.

{
  'ui:submitButtonProps':{
      showButton: true,
      buttonText: 'submit',

   }
}