Coming August 25, 2020 - Smart Gadgets: Data Lookup (Single Item), Data Lookup (List), and Data Multiselect

Updated August 27, 2020

Kuali Build is excited to introduce our new Smart Gadgets: Data Lookup (Single Item), Data Lookup (List), and Data Multiselect. Through some behind the scenes magic, these "smart" gadgets allow you to connect to other data sources and allow fields to be automatically populated in your users' forms based on information they provide.

Want a list of all the courses the form submitter is registered for? No problem. The Data Lookup (List) gadget can help with that. Want the form to populate with your faculty members' office location and department? The new data gadgets can help with that too. 

Note: The smart gadgets may require API integrations to be added in Kuali Build. Your IT department may be able to facilitate this for you. More information on how to do that can be found in the Create an API Integration for Data Set Feature guide. 

What are the do the new Data Gadgets do?

Once you have navigated to the Form Builder page of your app, the new smart gadgets can be found in the Smart Gadgets section in the left panel of the Form Builder.  

• Data Lookup (Single Item): Automatically fills in additional information on the form based on information provided earlier or associated with a user's profile. For example, a student may provide their student id on the form. The Data Lookup (Single Item) gadget could then automatically populate other fields with the student's GPA, major, email address, etc. A Data Lookup (Single Item) field is not editable in the form by the form submitter.
• Data Lookup (List): Allows the form submitter to select a single item from a dropdown menu or typeahead gadget based on information provided earlier in the form or associated with a user's profile. For example, a student may provide their student id on the form. The Data Lookup gadget could then populate a list of their courses allowing them to select a course. 
• Data Multiselect: Functions like the Data Lookup (List) gadget but allows the form submitter to select multiple items from a dropdown menu or typeahead gadget. For example, a student may wish to select multiple courses rather than just a single course as in the previous example.

How do I use the Data Lookup (Single Item) Gadget?

Once the appropriate API integration(s) have been configured on the backend (see Create an API Integration for Smart Gadgets Feature), the Data Lookup (Single Item) gadget is ready to use.

• Let's say I want a student to fill out a field on my form that requests their student ID, and then I want some additional information to be included automatically on the form. Drag and drop the Short Text gadget into the center of your form, and give it the label "Student ID."
• Drag and drop the Data Lookup (Single Item) gadget into the center panel of your form.
• Fill in the Gadget Label/Question. For example, once the student fills in the Student ID field, I want the form to populate with their GPA and the name of their advisor. 
• Choose the Data Source where the information that will populate this gadget comes from.
  • Note: Some data sources require extra pieces of information to be available in the form or from the submitter in order to work properly. This setting will notify you if that is the case.

• If your data source requires an input, or an additional piece of information, you will then be prompted to select the form field or metadata field where that information can be found. You can also include a Hard-coded value, if needed. I will select the Student ID field I created earlier.

• Select any other desired settings in the configuration panel on the right side of the screen.
  • Note: Although all form builder gadgets perform different functions and have unique settings, many of their initial gadget settings are the same. To see more information about some of the shared settings see What settings are available in the Form's Configuration Panel? The settings unique to the Data Lookup (Single Item) gadget are described below.
• Under the "Add linked auto-filled gadgets" setting you have the option to add any Data Lookup (Single Item) fields that were configured with this integration. Simply drag and drop the desired linked gadgets into form. I have added the GPA and Advisor fields in the screenshot below. Once the student types in their student ID the GPA and Advisor fields will automatically populate. 

How do I use the Data Lookup (List) Gadget?

Once the appropriate API integration(s) have been configured on the backend (see Create an API Integration for Smart Gadgets Feature), the Data Lookup (List) gadget is ready to use.

• Let's say I want a student to fill out a field on my form that requests their student ID, and then I want a list of their classes to automatically populate a dropdown menu. Drag and drop the Short Text gadget into the center of your form, and give it the label "Student ID."
• Drag and drop the Data Lookup (List) gadget into the center panel of your form.
• Fill in the Gadget Label/Question. Because I want to get a list of this student's current courses, I have labeled this gadget "Current Courses." This gadget will allow the student to select 1 of their courses from the gadget's dropdown menu.

• Choose the Data Source where the information that will populate this gadget comes from.
  • Note: Some data sources require extra pieces of information to be available in the form or from the submitter in order to work properly. This setting will notify you if that is the case.

• If your data source requires an input, or an additional piece of information, you will then be prompted to select the form field or metadata field where that information can be found. You can also include a Hard-coded value, if needed. I have selected the Student ID field I created earlier.

• Select any other desired settings in the configuration panel on the right side of the screen.
  • Note: Although all form builder gadgets perform different functions and have unique settings, many of their initial gadget settings are the same. To see more information about some of the shared settings see What settings are available in the Form's Configuration Panel? The settings unique to the Data Lookup (List) gadget are described below.
• Under the "Add linked auto-filled gadgets" setting you have the option to add any Data Lookup (Single Item) fields that were configured with this integration. I have added a Course Code and a Course ID fields in the screenshot below. Once the student selects a particular course from the Current Courses gadget, the Course Code and Course ID fields will automatically populate with information related to that course.

How do I use the Data Multiselect Gadget?

Once the appropriate API integration(s) have been configured on the backend (see Create an API Integration for Smart Gadgets Feature), the Data Multiselect gadget is ready to use.

• Let's say I want the student to fill out a field that requests their student ID, and then I want a list of their classes to automatically populate a dropdown menu. Drag and drop the Short Text gadget into the center of your form, and give it the label "Student ID."
• Drag and drop the Data Multiselect gadget into the center panel of your form.
• Fill in the Gadget Label/Question. For example, I want to get a list of this student's current courses, so I have labeled this gadget "Current Courses." This gadget will allow the student to select 1 or more of their courses from the gadget's dropdown menu.

• Choose the Data Source where the information that will populate this gadget comes from.
  • Note: Some data sources require extra pieces of information to be available in the form or from the submitter in order to work properly. This setting will notify you if that is the case.

• If your data source requires an input, or an additional piece of information, you will then be prompted to select the form field or metadata field where that information can be found. You can also include a Hard-coded value, if needed. I have selected the Student ID field I created earlier.
• Select any other desired settings in the configuration panel on the right side of the screen.
  • Note: Although all form builder gadgets perform different functions and have unique settings, many of their initial gadget settings are the same. To see more information about some of the shared settings see What settings are available in the Form's Configuration Panel?

How do these gadgets relate to the user/group typeahead and multiselect gadgets?

The Legacy Gadgets (User Typeahead, User Multiselect, Group Typeahead, Group Multiselect, External Data Dropdown, and External Data Autofill) are now replaced with the new data gadgets and will soon be deprecated.

The Data Lookup (List) gadget replaces the User and Group Typeahead gadgets, and the Data Multiselect gadget replaces the User and Group Multiselect gadgets.

We recommend migrating to the new data gadgets as soon as possible. You can easily migrate a legacy gadget by selecting it in the Form Builder. At the top of the gadget's configuration panel you will see a Migrate Now button.

Once the Migrate Now button is selected, it will automatically migrate the gadget to the new smart gadget that replaces it. Data will also migrate. Meaning, that field on documents previously submitted will look the same as the field on documents submitted after the migration.  

Other Smart Gadget Tips and Tricks

• If you are using multiple Smart Gadgets and linked auto-filled gadgets in a form, those fields/gadgets that are linked will highlight in blue in the Form Builder once one of the fields has been selected.
• Linked auto-filled gadgets are added to the metadata of your app whether or not you actually use them as a field on your form. As such, they can be used to limit visibility of other gadgets on the form. Meaning, it is possible to set up a conditional visibility rule using a linked auto-filled gadget.
• Because linked auto-filled gadgets are added to the metadata of your app, you can also use them to filter data in the Document List.
• Deleting a smart gadget from your form will also remove any linked auto-filled gadgets as well.