Calling a REST API Web Service in Form Script

Calling a REST API Web Service in Form Script

Overview

This article will walk you through how to call a Web Service from your Form via the Field2Base JavaScript Library.

Initialization
To initialize a call, you will need to assign the endpoint for your Web Services provider.
  1. WebServices.startRestService(Endpoint, Method);
where
Endpoint: Web Services provider URI
Method: GET, POST

Authorization
You can add an HtmlHeader if Authorization or other information is required from your Web Services provider.
  1. WebServices.addHtmlHeader(Header, Value);
where
Header: Header Name (ex: Authorization)
Value: Header Value (ex: Basic Token)
Note: Mobile Forms currently only support Basic authentication.

Parameters
You can also add a parameter to your API request.
  1. WebServices.addParameters(Key, Value);
where
Key: Parameter Key (ex: ID)
Value: Parameter Value (ex: 5)
 

Sample Code

Field2Base User and Folders REST API

  1. WebServices.startRestService("https://fieldconnect.field2base.com/v2/api/users", "GET");
  2. WebServices.addHtmlHeader("Authorization", "Basic {CompanyID}:{Username}:{Password}:{API Sync Key});
  3. WebServices.call("handleUserList");

Result
  1.  {
  2.     "UserKey": "5f6d0589-dad0-4fe1-8acc-7669bcxxxxxx",
  3.     "UserName": null,
  4.     "EnableWebAccess": true,
  5.     "Password": null,
  6.     "PasswordNeverExpires": null,
  7.     "ForcePasswordChangeOnLogin": null,
  8.     "PIN": 123ABC,
  9.     "FirstName": "Test",
  10.     "MiddleName": null,
  11.     "LastName": "User",
  12.     "PhoneCode": null,
  13.     "Phone": null,
  14.     "Email": " test@test.com ",
  15.     "Projects": [
  16.          "1be2fd67-9c0b-40ba-a440-xxxxxxxxxxxx",
  17.          "ed02146a-2ca7-4ce7-980f-xxxxxxxxxxxx",
  18.          "3fec86e5-7069-41e4-966e-xxxxxxxxxxxx"
  19.     ],
  20.     "Groups": [
  21.         "Basic Workflow Approval Group",
  22.         "Basic Workflow Recipient Group",
  23.     ],
  24.     "OptionalRecipient": null,
  25.     "Roles": [
  26.          "Mobile Forms Administrator",
  27.          "Web App User"
  28.     ],
  29.     "PersonnelID": null,
  30.     "PersonnelType": null,
  31.     "JobTitle": null,
  32.     "DefaultLocation": "",
  33.     "DefaultGroup": null,
  34.     "ActivationLimit": null,
  35.     "SendPasswordEmail": null,
  36.     "AllowForgotPasswordToolToResets": true,
  37.     "UserType": "User",
  38.     "LastLogin": "2022-11-23T17:24:21.837",
  39.     "CreationDate": "2021-11-23T17:24:21.837",
  40.    "RequireAlwaysSSO": null
  41.   }
  
Result Handler
  1. WebServices.call("handleUserList");
The handleUserList is a JavaScript function that handles the result of your RESTful call. The Web Services call will return a string(result) that contains the JSON data as seen above. To be able to parse the data, you need to use eval() to convert the result into a JavaScript Object.
In this example, we create the userList[] array with the usernames for all Users in the Approval Group. Then, we populate the array to a Datasource region in the Form to create a drop-down with all the Users who are in the specified group.
  1. function handleUserList(result) {
  2.     var resultObj = eval(result);
  3.     var userList = [];
  4.     for (var i = 0; i < resultObj.length; i++) {
  5.           for (var j = 0; j < resultObj[i].Groups.length; j++) {
  6.             View.showDialog(resultObj[i].Groups, 0)
  7.                 if (resultObj[i].Groups[j] == '1629') {
  8.                       userList.push(resultObj[i].UserName);
  9.                       break;
  10.                 }
  11.           }
  12.     }
  13.     Form.getRegion("Page1@ApprovalGroupUsers").setDatasourceList(userList);
  14. }

Zippopotam.us

In this example, the city and state are populated when someone enters a 5 digit zip code into the Zip Region.
  1. function Page1_Zip_ValueChanged(objArgs) {
  2.     var zipCode = objArgs.getRegion().getValue();
  3.     if (zipCode.length == 5) {
  4.         WebServices.startRestService("http://api.zippopotam.us/us/" + zipCode, "GET");
  5.         WebServices.call("handleZipResult");
  6.     }
  7. }
  8. function handleZipResult(result) {
  9.     var ResultObj = eval(result);
  10.     var state =ResultObj.places[0]["state abbreviation"];
  11.     var city = ResultObj.places[0]["place name"];

  13.     Form.getRegion("Page1@State").setValue(state);
  14.     Form.getRegion("Page1@City").setValue(city);
  15. }