Form Bridge with kViewer to Pull Data from Kintone Apps Tutorial
- Introductory
- Step 1. Create the Product Master App in Kintone
- Step 2. Create the Product Master DB list view in kViewer
- Step 3. Create the Quote Request Management App in Kintone
- Step 4. Create the Quote Request form in Form Bridge
- Step 5. Set up the kViewer lookup in Form Bridge
Back to Form Bridge Overview page
Introductory
When creating a public web form using Form Bridge, data in Kintone can be referenced and pulled with the kViewer integration.
We will go through how to set up the Form Bridge “Quote Request Form” references data of the “Product Master App” in Kintone.
Step 1. Create the Product Master App in Kintone
Login to Kintone. Create a new app. You may already have a Product Master App, but for the tutorial, we will use a simple app with the Product ID, Product Name, and Price.
Step 2. Create a Public API View in kViewer
Login to kViewer. From the “Create a new view” screen, click on “Public API” to make a Public API View and register the necessary information.
Reference: Getting Started with kViewer
Enter in the fields you’d like to use with the kViewer lookup as well as the number of records to fetch with a single request. The number of records you specify for a single request will be the number of records that are shown on a single page of the lookup. Make sure to save, deploy, and make the view public.
Step 3. Create the Quote Request Management App in Kintone
Create a new app in Kintone. For all the fields that are planned to use the kViewer lookup function to pull data from Kintone, do not use the “Lookup” field on the Kintone. Form Bridge does not support the “Lookup” field on Kintone. Therefore, the key of the lookup field in the Kintone app will not be displayed on the Form Bridge form.
Step 4. Create the Quote Request form in Form Bridge
Login to Form Bridge and create a new web form using the Quote Request Management App.
Reference: Getting Started with Form Bridge
Step 5. Set up the kViewer Lookup in Form Bridge
Make sure to be signed into kViewer and Form Bridge in the same browser. In Form Bridge, go to the kViewer tab and click the blue button to connect kViewer and Form Bridge.
If the text on the button has changed to “Update to kViewer connection” then you’re on the right track. Next we will move on to the field settings.
You should now be able to use the “kViewer Lookup” field.
Add a kViewer Lookup field to your form and click on the gear mark to go to the settings.
Then, enter in the settings for the lookup as follows.
A. Base view of lookup: Select the view created on Step 2.
B. Display kViewer field: Select the information to display when referencing data.
C. Search field: Select the field to use to search. Checking the box will prevent partial matches from being returned in the search.
D. Change a field’s value in a record from the API view when selecting: Set up the Form Bridge fields you would like the kViewer lookup fields to populate.
Save the form, and deploy. Let’s test out the lookup on the form.
The lookup has been created. Try entering in a product name.
The data that applies to that search will appear.
The information shown at this stage is from the fields that were selected in B earlier. Furthermore, the maximum number of fields shown on one page here is what was decided in step 2 when the kViewer Public API View was created. Clicking “Select” will insert the selected data into the appropriate fields of the form.
Navigate
- Introductory
- Step 1. Create the Product Master App in Kintone
- Step 2. Create the Product Master DB list view in kViewer
- Step 3. Create the Quote Request Management App in Kintone
- Step 4. Create the Quote Request form in Form Bridge
- Step 5. Set up the kViewer lookup in Form Bridge
Back to Form Bridge Overview page