JS API documentation

Download the latest JS SDK library from the CDN URL given below and link it using the script tag.

CDN URL - https://js.zohostatic.com/creator/widgets/version/1.0/widgetsdk-min.js

Initialize the SDK using the below method and use then block to write the logic


ZOHO.CREATOR.init()
        .then(function(data) {
          //Code goes here
        });

To get the value from the parameters configured in pages, use the below method


var queryParams = ZOHO.CREATOR.UTIL.getQueryParams();

The values of the image field will be an API endpoint in case the image is uploaded from computer or phone, use the below method to convert the endpoint to image data and assign the value to the source of the image tag. In another case, the image can be a public image link, and this method works for both cases.


var imageTag = document.getElementById("imgtag");
var imageURL =
"/api/v2/zylker/Contacts/view/All_Contacts/66359000000015039/Upload/download";
ZOHO.CREATOR.UTIL.setImageData(imageTag, imageURL, callbackFunction);

Widget API allows customers to push and pull data from other apps in their AppCreator account. The success of the API call to push or pull data in other apps depends on the permissions provided for users of that app.

Record APIs

These APIs help you perform different tasks with the records of the application. The various Record APIs are as follows:

Note: appName needs to be passed only when you need to push or pull data from other apps in your account.

Add Record
Update Record
Get All Records
Get Specific Record Using ID
Delete Record
Upload File

Add Record

Method : addRecord

Name	Description
formName	Link name of the form to which the records to be added. Refer this page to view and change the link name.
data	Form data in json format, where the format for all the fields has been specified here.
appName	Link name of the application from which data needs to be pushed to.

Syntax :


//configuration json
config = {
        appName : "${APPNAME}",
        formName : "${FORMNAME}",
        data : "${FORMDATA}"
}
//add record API
ZOHO.CREATOR.API.addRecord(config).then(function(response){
	//callback block
});

Example :


var config = {

appName : "zylker"
       formName : "timesheet", 
       data : formData

} 
ZOHO.CREATOR.API.addRecord(config).then(function(response){ 
	if(response.code == 3000){
	 console.log("Record added successfully");
	}
});

Form data :

formData = {
    "data" : {
        "Name": {
            "first_name": "James",
            "last_name": "Kyle",
        },
        "Address": {
            "address_line_1": "Dari Mart",
            "address_line_2": "Hayden Bridge Rd",
            "district_city" : "Springfield",
            "state_province" : "Oregon",
            "postal_code" : "97477",
            "country" : "United States"
        },
        "Rich_Text" : "The phone number is <b>+1541-726-4051</b>",
        "Phone_Number": "+15417264051",
        "Single_Line": "A simple one line text",
        "Email": "james@zylker.com",
        "Dropdown" : "Open",
        "Radio" : "Closed",
        "Multi_Select" : ["New", "Used"],
        "Checkbox" : ["Refurbished", "Used"],
        "Number": "1000",
        "Decimal" : "1000.00",
        "Percent": "60.00",
        "Date_field" : "10-Jan-2020",
        "Date_Time" : "23-Mar-2020 12:25:43 PM",
        "Image" : "https://www.zylker.com/sites/default/profile-01.jpg",
        "Ur1": {
            "value": "Dari Mart",
            "url": "www.darimart.com",
            "title": "Dari mart provisional store"
        },
        "Lookup_Single_Select" : "521270000078464",
        "Lookup_Multi_Select" : ["5212750000247932","5212750000564867"],
        "SubForm" : [
            {
                "Single_Line" : "Service Equipment",
                "Dropdown" : "New Order"
            },
            {
                "Single_Line" : "Rotary Machine",
                "Dropdown" : "Replacement",
            }
        ]
    }
}

Response :

response = {
    "code": 3000,
    "data": {        
        "ID": "2000000245119"
    },
    "message": "success"
}

Update Record

Method : updateRecord

Name	Description
reportName	Link name of the report through which the record to be updated. Refer here to get and update the link name of a report
id	ID value of the record to be updated
data	Form data in json format, where format for all the fields have been specified here
appName	Link name of the application in which data needs to be updated.

Syntax :


//configuration json
config = {
        appName : "${APPNAME}",
	reportName : "${REPORTNAME}",
	id: "${RECORDID}",
	data : "${FORMDATA}"
}

//update record API
ZOHO.CREATOR.API.updateRecord(config).then(function(response){
 //callback block
});

Example :


var config = { 
       appName : "zylker"
       reportname : "All-Timesheet", 
       id : "2000000245119"
       data : formData 
} 

ZOHO.CREATOR.API.updateRecord(config).then(function(response){
	if(response.code == 3000){
		console.log("Record updated successfully");
	} 
});

Response :

response = {
 "code": 3000,
 "data": {  
  "ID": "2000000245119"
    },
 "message": "success"
}

Get All Records

Method : getAllRecords
Configuration :

Name	Description
reportName	Link name of the report through which the record to be updated. Refer here to get and update the link name of a report
criteria (optional)	Condition to filter the record, which is applied along with the condition specified in the report filter. The criteria must be specified in the following format is the link name of the field, which compares with the and the comparison is based on the . The supported operators are !=, <=, >=,<, >, == You can combine more than one criteria using logical AND (&&) and logical OR(\|\|) Example : (Stage == "Open" && Score > 40)
page (optional)	Index or number of the page to be retrieved. The default page number is 1
pageSize (optional)	Total number of records to be retrieved in the specified page. The default size is 100 and the maximum size is 200
appName	Link name of the application from which data needs to be pulled from.

Note :

The response will return the data that’s displayed in both the Quick view and Detail view of the corresponding report
When the Detail view sports a related block of data, which is related via a lookup field, this API’s response will also include the data from that lookup field's display fields.

Syntax :


//configuration json
config = {
        appName : "${APPNAME}",
	reportName : "${REPORTNAME}",
	criteria: "${CRITERIA}",
	page : "${PAGENUMBER}",
	pageSize : "${PAGESIZE}"
}

//get all records API
ZOHO.CREATOR.API.getAllRecords(config).then(function(response){
	//callback block
});

Example :


var config = { 
    appName : "zylker"
	reportName : "All-Timesheet", 
	criteria : "(Status == \"Open\" && Priority = \"High\")",
	page : 1,
	pageSize : 10
}

ZOHO.CREATOR.API.getAllRecords(config).then(function(response){
	var recordArr = response.data;
	for(var index in recordArr){
		console.log(recordArr[index]);
	}	
});

Response :

response = {
  "code": 3000,
  "data": [
    {
      "ID": "52129000000146011",
      "Name": {
        "first_name": "James",
        "last_name": "Kyle",
        "display_value": "James Kyle"
      },
      "Address": {
        "address_line_1": "Dari Mart",
        "address_line_2": "995 Hayden Bridge Rd",
        "district_city": "Springfield",
        "state_province": "Oregon",
        "postal_code": "97477",
        "country": "United States",
        "latitude": "33.9307727",
        "longitude": "-116.8767541",
        "display_value": "Dari Mart, 995 Hayden Bridge Rd, Springfield, Oregon, United States"
      },
      "Rich_Text": "The phone number is <b>+1541-726-4051</b>",
      "Phone_Number": "+15417264051",
      "Single_Line": "A simple one line text",
      "Email": "james@zylker.com",
      "Number": "23",
      "Decimal": "1000.00",
      "Percent": "60.00",
      "Date_field": "10-Jan-2020",
      "Date_Time": "23-Mar-2020 12:25:43 PM",
      "Dropdown": "Open",
      "Radio": "Closed",
      "Multi_Select": [
        "New",
        "Used"
      ],
      "Checkbox": [
        "Refurbished",
        "Used"
      ],
      "Image": "https://www.zylker.com/sites/default/profile-01.jpg",
      "File_Upload": "/api/v2/zylker/Contacts/view/Contacts/635900380/Upload/download",
      "Ur1": {
        "value": "Dari Mart",
        "url": "www.darimart.com",
        "title": "Dari mart provisional store"
      },
      "Lookup_Single_Select": {
        "display_value": "James - 4269",
        "ID": "521270000078464"
      },
      "Lookup_Multi_Select": [
        {
          "display_value": "Door Step Delivery",
          "ID": "5212750000247932"
        },
        {
          "display_value": "Cash on Delivery",
          "ID": "5212750000564867"
        }
      ],
      "Subform": [
        {
          "display_value": "Service Equipment,New Order",
          "ID": "5212750000433263"
        },
        {
          "display_value": "Rotary Machine,Replacement",
          "ID": "5212750000090778"
        }
      ]
    },
    {
      //Record 2
    },
    {
    //Record 3
    }
  ]
}

Get Specific Record Using ID

Method : getRecordById
Configuration :

Name	Description
reportName	Link name of the report through which the record to be updated. Refer here to get and update the link name of a report
id	ID value of the record to be retrieved
appName	Link name of the application from which data needs to be pulled from.

Note:

The response will return the data that’s displayed in the Detail view of the corresponding report
When the Detail view sports a related block of data, which is related via a lookup field, this API’s response will also include the data from that lookup field's display fields.

Syntax :


//configuration json
config = {
        appName : "${APPNAME}",
	reportName : "${REPORTNAME}",
	id: "${RECORDID}"
}

//get specific record API
ZOHO.CREATOR.API.getRecordById(config).then(function(response){
	//callback block
});

Example :


var config = {
       appName : "zylker"
       reportName : "All-Timesheet", 
       id : "2000000193171"
} 

ZOHO.CREATOR.API.getRecordById(config).then(function(response){
	console.log(response.data);
});

Response :

response  = {
 "code": 3000,
 "data": {
        "ID": "52129000000146011",
  "Name": {
            "first_name": "James",
            "last_name": "Kyle",
   "display_value": "James Kyle"
          },
  "Address": {   
   "address_line_1": "Dari Mart",
               "address_line_2": "995 Hayden Bridge Rd",
               "district_city" : "Springfield",
               "state_province" : "Oregon",
               "postal_code" : "97477",
               "country" : "United States"
   "latitude": "33.9307727",
   "longitude": "-116.8767541",
   "display_value": "Dari Mart, 995 Hayden Bridge Rd, Springfield, Oregon, United States"
  },
  "Rich_Text" : "The phone number is <b>+1541-726-4051</b>",
          "Phone_Number": "+15417264051",
          "Single_Line": "A simple one line text",
          "Email": "james@zylker.com",
  "Number": "23",
          "Decimal" : "1000.00",
  "Percent": "60.00",
          "Date_field" : "10-Jan-2020",
          "Date_Time" : "23-Mar-2020 12:25:43 PM",
  "Dropdown" : "Open",
          "Radio" : "Closed",
          "Multi_Select" : ["New", "Used"],
          "Checkbox" : ["Refurbished", "Used"],
        "Image" : "https://www.zylker.com/sites/default/profile-01.jpg",
        "File_Upload" : "/api/v2/zylker/Contacts/view/Contacts/635900380/Upload/download",
  "Ur1": {
               "value": "Dari Mart",
               "url": "www.darimart.com",
               "title": "Dari mart provisional store"
          },
  "Lookup_Single_Select" : {
            "display_value" : "James - 4269",
   "ID" : "521270000078464"
   
  },
  "Lookup_Multi_Select" : [{
   "display_value" : "Door Step Delivery",
            "ID" : "5212750000247932"
  },
  {
   "display_value" : "Cash on Delivery",
            "ID" : "5212750000564867"   
  }],
     "Subform" : [{    
   "display_value" : "Service Equipment,New Order",
            "ID" : "5212750000433263"
  },
  {   
               "display_value" : "Rotary Machine,Replacement",
            "ID" : "5212750000090778"
  }]  
 }
}

Delete Record

Method : deleteRecord
Configuration :

Name	Description
reportName	Link name of the report through which the record to be updated. Refer here to get and update the link name of a report
criteria	Condition to filter the record, which is applied along with the condition specified in the report filter. The criteria must be specified in the following format <Field Name> <Operator> <Value> <Field name> is the link name of the field, which compares with the<Value> and the comparison is based on the <Operator>. The supported operators are !=, <=, >=,<, >, == You can combine more than one criteria using logical AND (&&) and logical OR(\|\|) Example : (Stage == "Open" && Score > 40)
appName	Link name of the application from which data needs to be deleted.

Note: The maximum of 200 records can be deleted for every API call and you will receive error when the number of records exceeds 200.

Syntax :


//configuration json
config = {
        appName : "${APPNAME}",
	reportName : "${REPORTNAME}",
	criteria: "${CRITERIA}"
}

//delete record API
ZOHO.CREATOR.API.deleteRecord(config).then(function(response){
	//callback block
});

Example :


var config = { 
       appName : "zylker"
       reportName : "All-Timesheet", 
       criteria : "(Status == \"Invalid\" && Date '01-01-2019')"
} 

ZOHO.CREATOR.API.deleteRecord(config).then(function(response){
	console.log("Record has been deleted");
});

Response :

response = {
    "result": [{
        "code": 3000,
        "data": {
            "ID": "66359000000021016"
          },
        "message": "success"
       },
       {
       "code": 3000,
       "data": {
           "ID": "66359000000024309"
         },
       "message": "success"
      }
    ],
    "code": 3000
}

Upload File

Method : uploadFile
Configuration :

Name	Description
reportName	Link name of the report through which the record to be updated. Refer here to get and update the link name of a report
id	ID value of the record where the file to be uploaded
fieldName	Link name of the field to which the file has to be uploaded. Refer here to get the link name of the field. The allowed field types are Image, File Upload, Audio, Video. In case the file has to be uploaded to a field which has been added inside a subform, the fieldName will be subform field link name followed by the field link name of the field to be uploaded with (dot) in between. Example: ${SUBFORMFIELDNAME.FIELDNAME}
file	It is a javascript File object to be uploaded. Refer here to know more about javascript File API
parentId	In case the file has to be uploaded to a field which has been added inside a subform, then the parentId is the ID value of the parent record, i.e the main form record in which the subform has been embedded.
appName	Link name of the application in which data needs to be uploaded.

Note: The file can be uploaded only after submitting a record and this API will upload one file to one field at a time. In case of more number of fields in a form, this API need to call for each field separately

Syntax :


//configuration json
config = {
        appName : "${APPNAME}",
	reportName : "${REPORTNAME}",
	id: "${RECORDID}",
        fieldName : "${SUBFORMFIELDNAME.FIELDNAME}",
	parentId : "${RECORDID}",
        file : "${FILEOBJECT}"
}

//upload file API
ZOHO.CREATOR.API.uploadFile(config).then(function(response){
 //callback block
});

Example :


var fileObject = document.getElementById("fileInput").files[0];

var config = { 
        appName : "zylker"
	reportName : "All-Timesheet", 
	id : "2000000193171",
	fieldName : "Attachments",
	file : fileObject
} 

ZOHO.CREATOR.API.uploadFile(config).then(function(response){
 console.log("File uploaded successfully");
});

Response :

response = {
  "code": "3000",
  "data": {
    "filename": "Rental Agreement-March.pdf",
    "filepath": "1587402896598_Rental_Agreement-March.pdf",
    "message": "success"
  }
}

Was this article helpful? Yes, thanks!Not really

Share this post : FacebookTwitter

Top

Still can't find what you're looking for?

Write to us: appcreator-support@manageengine.com

JS API documentation

JS API documentation

Record APIs

Add Record

Update Record

Get All Records

Get Specific Record Using ID

Delete Record

Upload File

Related Topics

Was this article helpful? Yes, thanks!Not really

Still can't find what you're looking for?