Lookup record

Check if a record exists

Try it out!

Note: The email addresses are displayed for demo purposes, so that you can test the lookup.

Scenario

In some Forms, it is important to verify that the entered details are correct before proceeding. For example, you may want to check that an email address matches against a policy through a REST API call, or SQL query.

Challenge:
★★★☆☆

Steps

  1. In the Data section, click on your external Datasource, and click on the Queries tab. Click Create new query.
  1. Add binding: 'email' and provide a valid default value
  2. Enter your lookup query, e.g. select * from public."Employees" where "Email" = '{{email}}'
  3. Click Run Query and then Save Query.
  4. Clear the default value of the binding - it is no longer needed now that we have our schema saved. Make sure to Save Query again.
  1. Navigate to the Design section, Add component: Form
  2. Add component: Field Group, and set Type to 'Main with Sidebar'
  3. Add component: Text Field, and enter a Field name and Label
  4. Add component: Icon, and set the Icon, Size and Color
  1. Click the button beside On click
  2. Add Action: Execute Query
    1. Select the Datasource
    2. Select the Query
    3. Check Do not display default notification
    4. Provide the email binding, e.g. {{ Search Form.Fields.Search Email }}
  1. Add Action: Update State
    1. Set value 'EmployeeID' to JavaScript binding:
    2. return $("Action 1.Query result")?.data?.[0]?.["EMPLOYEE ID"]
      
  2. Add Action: Continue if / Stop if

  1. Add Action: Show Notification
    1. Set Type to 'Warning'
    2. Set Message to 'Employee not found!'
    3. Check Auto dismiss
  2. Be sure to Save
  1. Click on the Screen component (root level of the Component Tree). Add component: Repeater Block
  2. In the Settings Panel, select the 'Employees' table, set Limit to 1, and click the button beside Filtering
  3. Add filter: 'EMPLOYEE ID' Equals Binding {{ State.EmployeeID }} and Save
  1. Click on the Conditions tab, and click Configure conditions
  2. Add condition:
    1. Hide component IF {{ State.EmployeeID }} Is empty
    2. Save
  1. Add component: Form, and set Type to 'Update', and the Schema to the 'Employees' table
  2. Add component: Field group and click Update form fields


App export

Downloads may take a few seconds.