Skip to content

Commit

Permalink
Update Business form documentation (#784)
Browse files Browse the repository at this point in the history
* add text area mention on datasource update

* Updates

* Update data-flow.mdx

* Update data-flow.mdx

---------

Co-authored-by: Mikhail Volkov <[email protected]>
  • Loading branch information
vitPinchuk and mikhail-vl authored Aug 29, 2024
1 parent 3d8af1b commit db747f9
Show file tree
Hide file tree
Showing 4 changed files with 58 additions and 0 deletions.
58 changes: 58 additions & 0 deletions docs/business-forms/data-flow.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -164,6 +164,64 @@ We simplified work with the payload creation. The Business Forms panel has a des
src="/img/blog/2024-07-02-form-panel-4.0.0/update-payload.png"
/>

### Use Text Area with multiple lines

Text Area element allows you to create text with multiple lines:

<Image
title="Text Area element with multiple lines."
src="/img/plugins/business-forms/text-area-multiline.png"
/>

After entering the data and submitting the form, you may see a data source error. The issue is caused by not properly processing and converting multiple lines in the payload.

<Image
title="Data source update error with multiple lines."
src="/img/plugins/business-forms/datasource-error-update.png"
/>

To avoid this behavior, please add following steps in the Create Payload code editor:

- Find element refer to the TextArea element.
- Add replace logic to value `payload[element.id] = element.value.replaceAll("\n", "\\n");`

#### Code example

```js
const payload = {};

context.panel.elements.forEach((element) => {
if (!element.value) {
return;
}

/**
* Required logic to update the value
*/
if (element.id === "description") {
payload[element.id] = element.value.replaceAll("\n", "\\n");
return;
}

payload[element.id] = element.value;
});

/**
* Check payload using developer tools
*/
console.log("update payload:", payload);

/**
* Data Source payload
*/
return payload;
```

<Image
title="Create payload code editor with custom payload to update multiple lines."
src="/img/plugins/business-forms/datasource-create-payload-code-editor.png"
/>

### REST API

See the description for the Initial Request REST API. Both Initial and Update requests have the same parameters. Also similarly, you can use global and dashboard variables in the API server call along with header parameters.
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit db747f9

Please sign in to comment.