simple form
. We made a save button in the modal and placed it in the footer under the form input fields. We also defined a function saveRegistration
. In this tutorial we will make this function work, so that it saves the form data to a storage.
We have now reached our first backend function. In this function we will cover three steps:
- get the form mutations
- save the data to a new storage
- close the modal
When finished with these steps, the function will look like the picture to the right.
ui: get form data
in the menu. Click on the connector icon or the three dots, this opens a little menu to the right side of you block. In this menu you click on outlet
, this will open a modal where you see all of the outlets that are currently made or already made in the same blueprint. You can search for the outlet you used form the form, in this case registerform
The ui: get form data
block has four out pins. The form data
pin returns the full form object. You could use this for example to select a field and check if it already exists in your storage. In this case we do not use the form data object. We will use the mutations
pin. This pin provides all mutations in a form.
The Valid
out-pin returns true
if the validation is correct. Since we have no validation, it will also return true. If the validation is not correct, the last out-pin, the Failed
out-pin, provides an array containing the error messages for each field that does not match the validation. In the tutorial: display errormessages we will show you how to use the data from this array to show the errors to the user.
storage: create document
. Click on the select storage
button, here you can search and select the storage you want to use. Just type registrants
and by entering on the name you will have a new storage in your environment or you will select it if it already exists. Connect the Mutations
out-pin from the ui: get form data
block to the Mutations
in-pin from the storage: create document
block to bring the form data to the storage.
The storages in Rual are document-oriented databases, using JSON documents to store data. This method allows you to use a very flexible data model.
storage: create document
block and select ui: close modal
. Since we only use one modal, it is not necessary to connect the outlet. If you do not select an outlet, this block will close ANY
modal that opened at the latest point. Because we don't want any unforeseen effects if we extend our application later on, we will connect an outlet and select our modal outlet: registermodal
.
If you're just curious to see the data that you have put in the storage, you can go directly to the tutorial: datatable.