Flowable Forms

Flowable Forms

  • Release Notes
  • Guides
  • Components
  • Storybook

›Customization

Getting started

  • Introduction
  • Installation
  • Usage with react
  • Usage without npm or react
  • Usage with Angular

Basics

  • Expressions
  • Outcomes
  • Datasource
  • Utilities Library _
  • Edoras Adapter
  • Events
  • API
  • DevTools
  • Saving the payload
  • Basic Styles

Customization

  • Custom Styles
  • Custom Fetch function
  • Localisation
  • Additional data

Extend

  • Custom Components
  • Example Progress Bar
  • Progress Bar Input
  • Emoji Picker
  • Custom Datatable
  • Panel Composition
  • Custom Composition
  • Extend Flowable Work
  • Extend Flowable Design

Custom Fetch function

If you want to add authentication, CSRF prevention, custom headers, caching or special treatment of network requests, you can provide your own fetch function to the form engine. If you don't provide one, the form engine will use its own (also available in _.futch).

Fetch is a function very similar to the standard window.fetch but with an additional onProgress parameter:

ParamTYPEDescription
urlstringURL to be requested
options{method?: string, headers?: Headers,
body: string, mode: string}
method: Request method, usually GET or POST
headers: Headers to append, e.g. Content-Type
body: Data to send when using POST
mode: Request mode, e.g. cors, no-cors, same-origin
onProgress?({loaded: number, total: number}) => voidCallback to be called on upload progress

A Promise will be returned that resolves to an object with 2 methods:

MethodDescription
json()returns a Promise with the json
text()returns a Promise with the text

Then you pass your custom fetch function to the engine like this:

<Form
  ...
  fetch: customFetch
/>

NOTE: Please keep in mind that for now the expected fetch function is working only with JSON and string responses.

← Custom StylesLocalisation →
Docs
GuidesComponents
Private
SourceStorybook
Flowable Forms
Copyright © 2020 Flowable