Extension Pointers - JS SDK series #4: Managing data from a widget using ZOHO.CRM.HTTP

Extension Pointers - JS SDK series #4: Managing data from a widget using ZOHO.CRM.HTTP

Handling and managing the data between two applications is a major factor for an efficient business. There are a variety of ways to handle data between Zoho CRM and other third-party applications. You can use deluge CRM tasks, create connectors, use API tokens or JS SDK based on your business requirements. In this post, let's take a look at how the JS SDKs help manage data using a widget. 

The JS SDK ZOHO.CRM.HTTP supports different HTTP methods and allows you to make Ajax calls from a widget.

The different HTTP methods are:
  • GET - To retrieve data/resources from the resource server.
  • DELETE - To delete a resource at a particular location. 
  • PATCH - To update a specific detail of the resource. This method updates the target resource with the provided content without changing other data. 
  • POST - To insert or upload any new resource to the server.
  • PUT - To update an existing resource. This replaces the target resource with the updated content.
In this post, let's assume a couple of scenarios that may be involved in an integration between Zoho CRM and Asana, a project management application. Let's explore how the HTTP methods GET and POST can be invoked from a widget while implementing the integration.

Consider a service-based software development company that manages its sales cycle in Zoho CRM and project management in Asana. Once they close a deal for a new app development, they kickstart their work and handle the project development and management processes in Asana. An integration between these two services can handle some valid use cases.

Scenario 1: Let's assume that a new project will be created in Asana as soon as a deal is closed in Zoho CRM. In this case, the details about the new project will need to be added into Asana with information from the Deals module of Zoho CRM in order to continue project management in Asana.

Lets see how to achieve this scenario using ZOHO.CRM.HTTP.post JS SDK.

Syntax: HTTP POST

ZOHO.CRM.HTTP.post(request)

Here request is the request object constructed with the following details:

Request Object

Name
Type
Description
params
Object
Request parameters to be constructed to invoke HTTP POST.
headers
Object
Request headers required.
body
Object
Request parameters to be constructed to invoke HTTP POST.

createproject.js Code snippet:

Util={};
var orgVal;
var json;
var jsonObj;
var EntityId;
var EntityName;
var rec3;
var wid="11**********71"; //hardcoded the workspace id for demonstration purposes
var projname;
function initializeWidget()
{
//Subscribe to the EmbeddedApp onPageLoad event before initializing the widget 
ZOHO.embeddedApp.on("PageLoad",function(data)
{
EntityName=data.Entity;
EntityId=data.EntityId;
console.log(EntityId);
console.log(EntityName);.
//Fetching deal related details using getRecord API
ZOHO.CRM.API.getRecord({Entity:EntityName,RecordID:EntityId})
.then(function(data){
console.log(data)
projname= data.data[0].Deal_Name;
})

/*The personal access token of Asana has been stored in custom variable and retrieved using the getOrgVariable method */
ZOHO.CRM.API.getOrgVariable("jssdkextension__Accesskey").then(function(data){
org=data.Success;
orgVal="Bearer "+org.Content;
console.log
(org.Content);
console.log(orgVal);
})

Util.create=function()
{
setTimeout(function(){
/*Constructing the request parameter (header and body) to pass to the HTTP POST method */
var request ={
headers:{
Authorization : orgVal,
},
//Field values to create a project in Asana are passed in the body section
body:
{
"data": {
"name": projname,
"start_on": document.getElementById("dateproject").value,
"due_date": document.getElementById("lastdateproject").value,
"notes": document.getElementById("notes").value,
},
}
}
// Invoke the HTTP POST to create the project
ZOHO.CRM.HTTP.post(request)
.then(function(data){
jsonObj = JSON.parse(data);
console.log(jsonObj);
rec3=jsonObj.data.gid;
console.log(rec3);
})
},500)
}
})
//Initialize the widget
ZOHO.embeddedApp.init();
}

In this above code snippet, the Asana API to create a project is used. The deal-related details are fetched using getRecord Zoho CRM API. The fetched deal name, along with the input values (project start date, project due date and project notes), are constructed and passed to the body parameter of the API call. The project is created upon clicking the 'Create project in asana' button. Similarly, you can modify and enhance the above functionality according to your business needs.



Scenario 2: Assume after creating the project in Asana you have gone ahead and added some tasks for that project in Asana to manage the project. Now, while you're looking at the Zoho CRM contact associated with this particular project, you'd like to look at the tasks associated with that project, from within Zoho CRM itself.

Lets see how to achieve this scenario using ZOHO.CRM.HTTP.get JS SDK.

Syntax: HTTP GET

ZOHO.CRM.HTTP.get(request)

Here request is the request object constructed with the following details:

Request Object

Name
Type
Description
params
Object
Request parameters to be constructed to invoke HTTP GET.
headers
Object
Request headers required.

associatedTasks.js Code snippet:

Util={};
var orgVal;
var json;
var jsonObj;
var rec;
var pid="1**********3"; //hardcoded the project id for demonstration purposes
function initializeWidget()
{
//Subscribe to the EmbeddedApp onPageLoad event before initializing the widget 
ZOHO.embeddedApp.on("PageLoad",function(data)
{
/*The personal access token of Asana has been stored in custom variable and retrieved using the getOrgVariable method */
ZOHO.CRM.API.getOrgVariable("jssdkextension__Accesskey").then(function(data){
org=data.Success;
orgVal="Bearer "+org.Content;
console.log
(org.Content);
console.log(orgVal);
})
setTimeout(function(){
/*Constructing the request parameters to pass to the HTTP GET method for fetching tasks associated to the specific project*/
var request ={
headers:{
Authorization : orgVal,
}
}
// Invoke the HTTP GET to receive the response of the initiated request
ZOHO.CRM.HTTP.get(request)
.then(function(data){
jsonObj = JSON.parse(data);
console.log(jsonObj);
rec=jsonObj.data;
console.log(jsonObj.data);
//Looping through every task detail and retrieving the task names
for (i = 0; i < rec.length; i++) 
{
/*Creating a list and populating the task name of the different tasks associated with the respective project*/
var taskname=rec[i].name;
var node = document.createElement("LI");  
var textnode = document.createTextNode(taskname);  
node.appendChild(textnode);  
document.getElementById("myList").appendChild(node);  
}
})
},500)
})
//Initialize the widget.
ZOHO.embeddedApp.init();
}

In the above code snippet, we used the Asana APIs to get tasks. The list of tasks for a particular project is fetched using the get tasks API and populated in a list. Similarly, you can modify and enhance the above functionality according to your business needs.



In this way, you can use the JS SDK ZOHO.CRM.HTTP to manage data through different HTTP methods. We hope you found this information useful. Keep following for more inputs.

SEE ALSO


    • Recent Topics

    • Writing Checks to Employees for Reimbursable Expenses

      I couldn't find a way to write a check through books or expense to an employee for reimbursable expenses. The expense created an entry in the system with a debit (expense) credit (liability). I entered a bill and used the liability account so it would

    • Best way to automate quotes in CRM

      I am trying to take specific information from prospects/clients through Zoho Forms (contact info, square footage, surface area, etc.) and auto generate quotes based on the information submitted.  Ideally, the quote would be sent immediately after the form is submitted. I know Zoho has a few different ways to achieve this and wanted to know if there was a 'best practice' for automating the quotation function within CRM. Or if there was another app that can perform this functionality better (Zoho Commerce,

    • Disable fields in multiple subform rows

      Hello everybody! I have an odd one here. I have a subform that collects hours of operation. It contains these fields: Days, Type, Open, and Closed. On load of the form I add 7 rows with Mon - Sun in the Days field. I then disable that field and the add/delete

    • Sync Creator form submissions to WorkDrive folder

      I've made 10 Creator applications, and need to sync my each application's submissions into a WorkDrive folder. I need the form submissions to be PDF file type and sync to a specific folder for documentation purposes. I have tried to use a workflow, but

    • Share passwords/secrets and folders/chambers with external users

      Currently you allow sharing passwords with internal users, internal user groups, and third parties. The third party feature gives temporary access of 30 minutes and it does not have any sign up. What we really need is to properly share secrets/passwords (and ideally folders/chambers) with Zoho Vault users that are not part of our organisation - even if they are on the free plan. If they accept the share, the password would be stored in their Zoho Vault as long as I maintain the share. If I revoke

    • Popup or Highlight on the Form based on a comparison

      I have a field for Engine Odometer, and a field for next oil change in KM. Is it possible to generate a popup, or highlight the form, if the Engine Odometer number is larger than the next oil change in KM number?

    • View Kanban tasks in "Status" layout for all projects

      Hi I'm testing Zoho Projects Express to see if it is suitable for my business. So far it looks great and seems to do everything we want (except critical path on the Gantt charts), but one thing I can't seem to figure out is this: If I go into a project, and choose "Kanban", I can select the "Status" layout which is great. I can see the status of all of the tasks in that project, and who is working on what. However, if I go to: Home > My Tasks > Kanban, then the "Status" layout isn't an option - only

    • Subform dynamic fields on Edit, Load of Main form.

      Main Form: Time_Entry Sub Form (separate form): Time_Entries Time_Entries.Time_Entry_No is lookup to - Time_Entry.Time_Sheet_ID (auto number). I would like to disable some of the subform fields upon load (when edited) of the Time_Entry main form. What

    • Save Draft in email bigin for desktop and mobile

      Hi any news to when we going to have the save draft for email in bigin desktop and mobile?

    • Zoho Desk and Zoho Inventory

      I am hoping I am not the only one with this need but has anyone else notice the lack of integration between Zoho Desk and Zoho Inventory and eventual funneling into an Invoice in Zoho Books?  As an IT service provider we very often will sell parts (items) along with services for installing said item(s).  I have discovered that although you can integrate your Inventory Items into Desk as a "Product", it serves no real functionality.  In fact, I found the concept confusing compared to how many Service

    • Including Field in email body based on answer

      I am making a form as a checklist of our mechanics. I have it setup with choice matrix. The choices are "Bad" and "Good". I would like to have only the "Bad" show up in the email body. I am not against changing how it is setup, thank you.

    • Remove attachment from ticket

      Hello, When we receive e-mails from our customers, lots of those e-mails contain attachments with sensitive information, which we need to delete from the ticket after using it. It is forbidden for our company to store these attachments, due to security reasons.  Is there a possibility to delete an attachment from a ticket in any way? It is necessary for us that this possibility is available. Thanks in advance, Yorick

    • Fetch function not working for CRM Contacts

      I've created a flow that checks if a contact exists in CRM (based on form input), and if it does, then it updates one of the fields for the contact. In my test, the fetch function correctly identifies that a contact exists (based on email address), but

    • Zoho Bigin | Adding users to a deal in bigin

      Hi, One of our ongoing POCs required adding users to a deal in Bigin. I found that we cannot add individuals using custom fields when we have an Express license. Is there any way to do it?

    • How to create Comparison across Period chart in a dashboard?

      Hi all How can I create this chart in a custom dashboard? The issue for me is that this chart is very small. The CRM module (unlike Projects module) has no ability to expand a chart. I want to make it larger, but also want to include it in a custom Forecast

    • Validation Rules Trigger on Untouched Fields

      In Zoho Desk, validation rules trigger for ALL fields during an update—even fields that weren't modified in the current edit. This behavior is fundamentally different from Zoho CRM and other Zoho products, where validation rules only apply to fields actually

    • Add Subform Field based on Record Field

      Hi All, I am struggling with finding a solution that can populate a subform field based on an existing field on the record. Use case is I have added Current Exchange Rate on a quote as a custom field, I then have a subform with Quoted items that include

    • CREATE REPORT USING TWO FORMS

      ONE FORM CONTAINS LIST OF ALL CLIENTS WHOSE RETURN IS FILED AND OTHER FORM CONTAINS LIST OF RETURNS FILED YEARWISE. NOW I REQUIRED A REPORT OF ALL CLIENTS WHOSE RETURN ARE PENDING FOR A PARTICULAR YEAR

    • Custom Function : Copy multilookup field to text field

      Hi, I'm a newbie on function programming, I try to copy text from a multi lookup field named "societe" to a text field named "societe2". I've used this code. In deluge script it seems to work, but when I trigger this function it doesn't work (Societe2

    • Make other sub fields mandatory, if first subfield is not empty

      I am not finding an option in the rules to make other sub fields mandatory if the first sub field is not empty. I am using the name field to collect parts info, with sub fields of Part Name, Part Number, and Quantity. But I don't want these mandatory

    • How to normalize CRM module when integrating with Survey?

      This question is about the problem with many-to-many relationships and Survey. One of the things our organization does is track people in our program and their jobs. We get new information from the people three times annually through Zoho Surveys. Survey

    • Poor Search Results on Zoho CRM

      The search on Zoho CRM is quite poor. Salesforce has now published a new search, when will get this on Zoho? https://help.salesforce.com/s/articleView?id=data.c360_a_hybridsearch_index.htm&type=5

    • Parentheses in System Path

      Zoho WorkDrive includes a mandatory parenthesis with the organization name in the desktop sync client. This adds parens to the system path. Many command-line applications do not allow for the use of parenthesis, so if you want to use a file saved on WorkDrive in a command line you cannot. Most major document syncing platforms do not allow parenthesis for this reason.

    • Introducing Assemblies and Kits in Zoho Inventory

      Hello customers, We’re excited to share a major revamp to Zoho Inventory that brings both clarity and flexibility to your inventory management experience! Presenting Assemblies and Kits We’re thrilled to introduce Assemblies and Kits, which replaces the

    • Associating Multiple Work Orders with a Single Invoice in Zoho FSM

      Hello Everyone, Is it possible to associate multiple Work Orders with a single Invoice in Zoho FSM? Best Regards, Subhash Kumar

    • Client Script Quality of Life Improvements #1

      Since I'm doing quite a bit of client scripting, I wanted to advise the Zoho Dev teams about some items I have found in client script that could be improved upon. A lot of these are minor, but I feel are important none-the-less. Show Error on Subform

    • [Webinar] Evolving BI & Analytics in the Age of AI

      Artificial intelligence is redefining how data is collected, analyzed, and leveraged across industries. As businesses strive to become more agile and insight-driven, traditional BI and analytics must transform to meet new demands. AI-first organizations

    • 請求書に添付されているファイルをAPI経由で取得する際の問題について

      Books APIリファレンス 現在、Books APIを利用して請求書内の添付ファイルを取得するメソッドを構築しています。以下のコードを参考にしているのですが、添付ファイルが複数アップロードされている場合、responseにおいて2つ目のファイルの情報しか取得できない現象が発生しています。 headers_data = Map(); headers_data.put("Authorization", "Zoho-oauthtoken 1000.41d9xxxxxxxxxxxxxxxxxxxxxxxxc2d1.8fccxxxxxxxxxxxxxxxxxxxxxxxx125f");

    • Zoho CRM and Books Integration

      Evening, I have started the integration with FSM from CRM and having difficulties with the mapping. In CRM we use "Unit Price" as our cost price and mark this up on a subform to create a "Sell Price" this markup can be different on each quote depending

    • Leadchain into a custom module

      Hello ZOHO Community ! is it possible to put the leads collected by leadchain into a custom module instaed of leads module ? Best wishes Niels

    • Zoho Flow to Azure Devops

      hi, i'm getting this when trying reauthorize the connection from Zoho Flow to Devops but when i look in Devops there is no service connection related to Zoho So i do not know where i have to renew the mentioned client secret..

    • 533 Relaying disallowed

      When I try to send an email from my Zoho account, it gives me that error 533: relaying disallowed. What should I do? Please help.

    • Formula Module how to convert to percentage

      Hello There, I have create a formula field and i want the outcome to be in percentage how do i do that This is my formula ${Deals.Forecast Revenue Per Year}/${Deals.Annual Processing Volume} I have try ${Deals.Forecast Revenue Per Year}/${Deals.Annual

    • Sandbox - Your Secure Testing Space in Zoho Projects

      Managing projects often involves fine-tuning processes, setting up new automations, or making configuration changes. Making those changes directly in a live environment leaves no room for trial and error. Sandbox in Zoho Projects is a dedicated testing

    • Zoho CRM Functions 53: Automatically name your Deals during lead conversion.

      Welcome back everyone! Last week's function was about automatically updating the recent Event date in the Accounts module. This week, it's going to be about automatically giving a custom Deal name whenever a lead is converted. Business scenario Deals are the most important records in CRM. After successful prospecting, the sales cycle is followed by deal creation, follow-up, and its subsequent closure. Being a critical function of your sales cycle, it's good to follow certain best practices. One such

    • Third party apps for my mail

      Hello im new here and i have a very important issue. A third party company uses one of my emails to send invoices to our customers. My problem is that cannot connect to zoho mail server. my imap settings are corrent imappro.zoho.eu 993 smtppto.zoho.eu

    • 553 relaying disallowed invalid domain

      Hi, I have read the previous article but i am still facing issue , I have added all these in my domain manager under dns settings. type : cname host: zb14521202 value / points to : validate.zoho.com Can you please tell me why i am still facing same issue

    • Announcing new features in Trident for macOS (v.1.18.0)

      Hello everyone! Trident for macOS is here with interesting features and enhancements to elevate your workplace communication and productivity. Let's take a quick look at them. Retract sent emails. Whether you've missed adding an important attachment or

    • How do I add more space to a note in ‘draw’?

      I’m taking handwritten notes using the draw note, but I don’t seem to be able to scroll down to get more room on the page. How do I make more room to take notes?

    • Este domínio já está associado a esta conta

      Fui fazer meu cadastro na zoho e quando digitei meu domínio recebi essa mensagem que meu domínio estava associado a uma conta que eu nem faço idéia de quem seja. Como que faço pra resolver isso? Atenciosamente, Anderson Souza.

    • Next Page