Forms
Build blinks with multiple inputs and advanced input types, similar to HTML forms with validation.
Forms allow you to build blinks with multiple inputs and advanced input types. They work similar to HTML
forms, meaning you define input types, such as dropdowns, radio buttons, text, etc. and decide which input is required.
Once the users have finished their inputs, they click on the submit button to send the data to your blinks provider.
Best part: Our blink components even check if the inputs were correct before sending them to your backend, so that you don’t have to implement these checks again.
The following examples will show code examples for building forms. We will focus only on the GET
part. They won’t show how POST
requests look like, because the POST
interactions work the same way any other blink would. If yo want to see the POST
part, it is recommended to go to our donation blink example.
Forms usually have multiple input fields. This means that you have to work with linked actions
meaning you set your input params in the links object (see code example below).
Transfer blink example
This example contains the code for the GET
request of a SOL transfer blink. As you can see, the blink has two input fields.
The first is a text input for the wallet address and the required tag ensures that no empty textfield can be submitted. Second input is a number ensuring that the SOL amount that should be transferred is a number.
Advanced input types
The example above shows a very basic blink that transfers SOL to another Solana address. As already discussed in this section, there are more input types than text and numbers, which we refer to as advanced input types.
The following advanced input types are available:
text
email
URL
numbers
dates
date-times
checkboxes
radio buttons
text areas
select
Advanced input examples
Below are more examples that showcase how you can use advanced input types in your code. For full blink examples make sure you visit our guides section.
Dropdown and radio buttons
Here’s what that would look like when unfurled: