Skip to content

Using custom form buttons

Patrick Sachs edited this page Aug 6, 2018 · 6 revisions

Preamble

The default form provides two buttons out of the box: A submit button, and a reset button.

While these buttons certainly serve their purpose some forms require more buttons, or you might want to adjust the text of them(How dare you not want emojis on your production corporate website!).

Adjusting the default buttons

Adjusting the default buttons is the easiest task. The react-formilicious/defaultButtons module contains our default buttons, which we can then adjust:

import * as defaultButtons from "react-formilicious/defaultButtons";

defaultButtons.submit.name = "πŸ‘¨β€πŸš€ Beam the data up!";
defaultButtons.reset.name = "πŸ”₯ We can do better, reset!";

We can also override all buttons all together if so desired:

import * as defaultButtons from "react-formilicious/defaultButtons";

defaultButtons.setButtons([
  {
    key: "my-awesome-save-button",
    name: "πŸ’Ύ I ain't need no defaults!",
    action: "save",
    type: "info"
  }
]);

Clone this wiki locally