Browse Source

Merge pull request #8031 from nocodb/nc-docs/pre-fill

docs: prefill
pull/8040/head
Pranav C 8 months ago committed by GitHub
parent
commit
97ce57f60f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 36
      packages/noco-docs/docs/090.views/040.view-types/030.form.md

36
packages/noco-docs/docs/090.views/040.view-types/030.form.md

@ -32,7 +32,7 @@ Form view builder layout can be divided into 4 sections:
In the **Form View** area, click on in input boxes provided for **Title** & **Description** to add/update title & description to the form.
:::info
Formatting options are supported for the description field. You can also use markdown to format the text.
Formatting options are supported for the description field. You can also use Markdown to format the text.
:::
![Form Title & Description](/img/v2/views/form-view/title-description.png)
@ -80,19 +80,19 @@ NocoDB allows you to configure the form view to perform various actions after a
![Form View Settings](/img/v2/views/form-view/post-submit-settings.png)
:::info
Formatting options are supported for the `After Submit Message` field. You can also use markdown to format the text.
Formatting options are supported for the `After Submit Message` field. You can also use Markdown to format the text.
:::
## Field configuration
To change the field label displayed on the form & add help-text, click on the required field in the **Form Area** and on the right side configuration panel, configure
1. **Label** `Opitonal` : Defaults to the field name. This doesn't affect the field name in the table.
1. **Label** `Optional` : Defaults to the field name. This doesn't affect the field name in the table.
2. **Help Text** `Optional`
3. **Required** : Toggle to mark the field as required
![Field Label & Help Text](/img/v2/views/form-view/field-config.png)
:::info
Formatting options are supported for the `Help Text` field. You can also use markdown to format the text.
Formatting options are supported for the `Help Text` field. You can also use Markdown to format the text.
:::
### Field Type Specific Settings
@ -111,14 +111,22 @@ For select based field types, you can configure the options layout to be display
![Options Layout](/img/v2/views/form-view/options-layout.png)
## Prefill Form Fields
Prefilling form fields is a way to pre-populate form fields with default values. This can be useful when you want to save time for users by prefilling some fields with default values. The prefilled fields and their values are visible in the URL of the form view & can be manually constructed by ensuring URL parameters are appropriately encoded.
Here's a more professional rephrasing of the given content:
## Pre-Filling Form Fields
NocoDB offers a convenient feature that allows pre-filling form fields with specific values by setting URL parameters. This functionality enables the creation of custom URLs with desired field values, streamlining data entry and enhancing user experience.
To construct a pre-filled form URL manually, ensure that the URL parameters are appropriately encoded in the following format: `?key1=value1&key2=value2`.
For instance, the URL `https://wh8s5w.noco.to/#/nc/form/66da06-f074-47af-ace7-fde46df55?Status=Qualification&Priority=Very+high` pre-fills the `Status` field with `Qualification` and the `Priority` field with `Very high`.
NocoDB provides an intuitive alternative approach to generate pre-filled URLs through the form builder.
1. Open the form builder and pre-fill the required form fields with the desired values.
2. Click on the `Share` button located in the top right corner.
3. Toggle the `Enable Public Viewing` button to enable sharing.
4. Toggle the `Enable Prefill` button to enable pre-filling.
5. Click on the `Copy Link` button to copy the pre-filled URL.
NocoDB provides an easier approach to construct prefilled URLs. One can use the form builder to prefill form fields with default values & auto-generate encoded prefilled URL. Follow the below steps to prefill form fields & generate a prefilled URL -
1. Open the form builder, prefill the required form fields with default values.
2. Click on the `Share` button in the top right corner.
3. Toggle `Enable Public Viewing` button to enable share.
4. Toggle `Enable Prefill` button to enable prefill.
5. Click on the `Copy Link` button to copy the link.
![Prefill](/img/v2/views/form-view/prefill.png)
![Prefill share](/img/v2/views/form-view/prefill-share.png)
@ -129,15 +137,15 @@ NocoDB provides an easier approach to construct prefilled URLs. One can use the
:::
### Prefill modes
1. **Default**: Standard mode. This mode will prefill the form fields with the default values set in the form builder. Users can edit the prefilled fields. When shared, the prefilled fields will be visible in the URL. In the image below, the `Number` field is prefilled with the value `1234`, `Currency` field is prefilled with the value `1000` and `Year` field is prefilled with value `2023`.
1. **Default**: Standard mode. This mode will prefill the form fields with the values set in the shared form URL. Users can edit the prefilled fields in the form. In the image below, the `Number` field is prefilled with the value `1234`, `Currency` field is prefilled with the value `1000` and `Year` field is prefilled with value `2023`.
![Prefill default](/img/v2/views/form-view/prefill-default.png)
2. **Hide prefilled fields**: This mode will prefill the form fields with the default values set in the form builder but will hide the prefilled fields from the user. When shared, the prefilled fields will be visible in the URL. In the image below, the `Number` field is prefilled with the value `1234`, `Currency` field is prefilled with the value `1000` and `Year` field is prefilled with value `2023`.
2. **Hide prefilled fields**: This mode will prefill the form fields with the values set in the shared form URL but will hide the prefilled fields in the form from the user. In the image below, the `Number` field is prefilled with the value `1234`, `Currency` field is prefilled with the value `1000` and `Year` field is prefilled with value `2023`.
![Prefill hide](/img/v2/views/form-view/prefill-hide.png)
3. **Lock prefilled fields as read-only**: This mode will prefill the form fields with the default values set in the form builder and will lock the prefilled fields as read-only. When shared, the prefilled fields will be visible in the URL. In the image below, the `Number` field is prefilled with the value `1234`, `Currency` field is prefilled with the value `1000` and `Year` field is prefilled with value `2023`.
3. **Lock prefilled fields as read-only**: This mode will prefill the form fields with the values set in the shared form URL and will lock the prefilled fields as read-only. In the image below, the `Number` field is prefilled with the value `1234`, `Currency` field is prefilled with the value `1000` and `Year` field is prefilled with value `2023`.
![Prefill lock](/img/v2/views/form-view/prefill-lock.png)

Loading…
Cancel
Save