Smart Form

​

1. Use Case

​

2. Steps

​

2.1 Step 1: Create the “Smart Form Template Query” Form

1. Create a form named “Smart Form template query”.
2. Add a member component, name it “Template creator”, and set it as required. (See Figure 2.1-1.)

3. Add a dropdown select component. Add two custom options: display value “General form” with option value “0”, and display value “Education form” with option value “1”. Set it as required. (See Figure 2.1-2.)

4. Click Save in the upper-right corner.

​

2.2 Step 2: Create the “Query Result Record Table” Form

1. Create a form named “Query result record table”.
2. Add a multi-line text component, name it “Returned result”, and set its status to Hidden. (See Figure 2.2-1.)

3. Add a subform, name it “Query result record”, and add 10 single-line text components inside the subform, named “Form code”, “Form name”, “Form tips”, “Form type”, “Form cycle”, “Form deadline”, “Created time”, “Form category”, “Form terminated”, and “Form creator”. Set the status of each text component to Read-only. (See Figure 2.2-2.)

4. Click Save in the upper-right corner.

​

2.3 Step 3: Create and Configure the Connector

1. On the admin console, select the “Smart Form template query” form, click Integration & Automation, and then click Create Integration & Automation. (See Figure 2.3-1.)

2. Name the connector “Get Smart Form templates created by an employee”, select Form event trigger, and click Confirm.

3. Configure the form event trigger: set the trigger event to Created successfully, set the data filter to All data, and click Save.

4. Select the connector app: choose the Smart Form app, and click Next. (See Figure 2.3-4.)

5. Select the connector action: choose Get user form templates, and click Next. (See Figure 2.3-5.)

6. Configure the connector action and click Save. (See Figure 2.3-6.)

7. Add a Create data node below the connector node. (See Figure 2.3-7.)

8. Configure the Create data node and click Save. (See Figure 2.3-8.)

9. Click Save in the upper-right corner, and then click Publish.

​

2.4 Step 4: Configure the “Query Result Record Table”

// Get the data passed by the connector into the multi-line text component.
// textareaField_kwcv17cj is the unique code of the "Returned result" multi-line text component on the page.
let obj = this.$('textareaField_kwcv17cj').getValue();
// The value of obj is a string. JSON.parse() converts obj into an object.
  let res = JSON.parse(obj);
// Create an empty array "arr" to store the processed data.
  let arr = []
// Iterate over the res variable.
  const data = res.map(item=>{
    let object = {};
// Replace the code between "object." and "=" in lines 12–21 with the unique identifier of each component inside the subform.
    object.textField_kwcvykby = item.name;
    object.textField_kwcvykbz = item.memo;
    object.textField_kwcvykbx = item.form_code;
    object.textField_kwcvykc0 = item.setting.form_type === 0 ? "One-time form" : "Recurring form";
    object.textField_kwcvykc3 = item.setting.form_type === 0 ? "Non-recurring form" : item.setting.loop_days;
    object.textField_kwcvykc5 = item.setting.end_time ? item.setting.end_time : "No deadline set";
    object.textField_kwcvykcb = item.setting.create_time;
    object.textField_kwcvykcc = item.setting.biz_type === 0 ? "General form" : "Education form";
    object.textField_kwcvykcd = item.setting.stop === false ? "Not terminated" : "Terminated";
    object.textField_kwcvykce = item.creator;
// Add the processed object to the arr array. Each object represents one subform record.
    arr.push(object);
  })
// Assign the arr array data to the subform component.
// Replace tableField_kwd6plxz with the unique identifier of the subform in your form.
  this.$("tableField_kwd6plxz").setValue(arr);

​

2.5 Step 5: Submit the Form Data

​

3. Result