Training registration applet registration function development

In the training registration applet, we have developed a home page and a list page. When you click on the registration page on the list page, you will jump to the registration page. Let’s look at our prototype first. The
insert image description here
registration page is divided into two parts. The first half is to display the detailed information of the course, and the second half is the specific submission information. This article introduces the development of the registration page function

1 Create a page

When developing functions, you need to create a page first, open our application, click the icon to create a page, and create our registration page
insert image description here
insert image description here

2 New URL parameters

Because we need to display the detailed information of the course, we need to pass in the data identifier of the course. Select the page and create a parameter
insert image description here
insert image description here

3 Course Details

To display the details of the course, we use the data details component. Drag a data details component
insert image description here
data model from the component area on the right. We need to select our training content data source, set our data filtering, and make the data identifier equal to our URL. parameter
insert image description here
and then delete the redundant components
insert image description here

4 Registration data source creation

To store the information submitted by the user, you need to create a data source, switch to the data source creation view, we add a registration data source input the
insert image description here
name of the data source registration information
insert image description here
click edit, enter the field addition view
insert image description here
click add field
insert image description here
first add name, field type If we choose text
insert image description here
and gender, we choose the enumeration type. We need to create an option set. Click Create Now. Enter the field for ID
insert image description here
insert image description here
card
insert image description here
.
insert image description here
Enter the field for phone number.
insert image description here
For the field of training content, select the association relationship for the type, and associate with the training content
insert image description here
. In order to distinguish data permissions, we also need to add an openid field
insert image description here
so that the data source is created.
insert image description here

5 Registration information function development

In the second part, we need to allow users to enter the specific data required for registration. We use the form container component to allow users to input data, drag in a form container component, and select the registration information for the data model. It should be noted here that the training content needs to set default values.
insert image description here
We Bind as the URL parameter
insert image description here
openid to bind our system variables, select from the current user
insert image description here

6 Set page jump

After the registration information page is set up, we need to allow the list page to jump to the registration page. We switch back to the list page, bind the click event to the data, select the action to open the page, and then pass in our data identifier
insert image description here
insert image description here

7 The final effect

insert image description here

Summarize

This article introduces the development of the registration information function, covering the creation of data sources, data details, the use of form container components, and the transfer of page jump parameters. The characteristics of low-code development are based on components, setting properties, setting styles, and setting events. As long as you master the basics, you can develop software according to your own needs. If you are interested, follow the tutorial and try it out.

Guess you like

Origin blog.csdn.net/u012877217/article/details/132140716