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


    • Sticky Posts

    • Kaizen #198: Using Client Script for Custom Validation in Blueprint

      Nearing 200th Kaizen Post – 1 More to the Big Two-Oh-Oh! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.

    • Kaizen #226: Using ZRC in Client Script

      Hello everyone! Welcome to another week of Kaizen. In today's post, lets see what is ZRC (Zoho Request Client) and how we can use ZRC methods in Client Script to get inputs from a Salesperson and update the Lead status with a single button click. In this

    • Kaizen #222 - Client Script Support for Notes Related List

      Hello everyone! Welcome to another week of Kaizen. The final Kaizen post of the year 2025 is here! With the new Client Script support for the Notes Related List, you can validate, enrich, and manage notes across modules. In this post, we’ll explore how

    • Kaizen #217 - Actions APIs : Tasks

      Welcome to another week of Kaizen! In last week's post we discussed Email Notifications APIs which act as the link between your Workflow automations and you. We have discussed how Zylker Cloud Services uses Email Notifications API in their custom dashboard.

    • Kaizen #216 - Actions APIs : Email Notifications

      Welcome to another week of Kaizen! For the last three weeks, we have been discussing Zylker's workflows. We successfully updated a dormant workflow, built a new one from the ground up and more. But our work is not finished—these automated processes are

    • Recent Topics

    • Journal Entries Do Not Show Multiple Entries to the Same Account

      Another basic accounting function that Books ... Accountants sometimes write journal entries, debiting and/or crediting the same account in the same entry. This is due to the need to record specific activity in an account when we pull reports especially

    • Create static subforms in Zoho CRM: streamline data entry with pre-defined values

      Last modified on (9 July, 2025): This feature was available in early access and is currently being rolled out to customers in phases. Currently available for users in the the AU, CA, and SA DCs. It will be enabled for the remaining DCs in the next couple

    • Partial customer Refund via customer Credit Card used to pay invoice

      How can we process a partial refund through the same credit card that a customer used to pay the initial invoice? - In other words, say a customer was sent an invoice for $1200.00 and they paid it through Zoho with our online credit processor, PayFlow

    • Partial refunds

      I am trying to process refund for a one item invoice, however the refund is partial: i am getting this error while creating credit note, can anyone share some wisdom about this

    • How in the heck do i record a (partial) refund???

      I have a client. wrote an invoice for 3 services totalling $520. He paid it online (we use zoho to authorize.net) We went out and couldn't do one of the services I didn't see a way to initiate a refund through zoho books, so i did a $250 refund through authorize.net. Tried to edit the payment on zoho books, but it won't let me b/c "this payment was made on line" When i try to edit the invoice i get a popup about it no longer matching the payment. What do I do??? And why is it so hard to do something

    • Action Required: Update your Zoho Projects – Zoho Analytics integration

      Dear Zoho Projects integration users, We would like to inform you about an upcoming update to the Zoho Projects–Zoho Analytics integration. Read the full migration announcement here. As shared in the announcement, we are updating the integration to support

    • Mirror Component in Zoho CRM: Access real-time related data without leaving your record

      Hi everyone, This feature is now available for the JP, CA, SA, UAE, and AU DCs. We're excited to bring to you Zoho CRM's mirror component, which presents relevant data on a record's details page and keeps everything users need in one place without having

    • Workflows fail silently in Zoho CRM and there is no native way to know

      Workflow automation is honestly one of the biggest reasons my clients choose Zoho. But there is one problem I keep running into across almost every implementation. When a workflow fails, nobody finds out. Email alerts hit daily limits and just stop. Custom

    • Office365(outlook emails) Zoho CRM integration

      Hi guys We're looking to buy Zoho CRM and are currently trialling. I'm working from a MacBook fyi. I've so spent 3 hours on live chat today with Zoho as we couldn't get the two to integrate properly, even with the plug in installed but finally managed

    • When adding subform records, how do I access member fields of a name field

      I have the following code (runs when a record is added to a form) if (input.P_liza != null) { input_deal = input.P_liza; rec = form_mapping[deal_name == input_deal]; id = input.N_mero_de_documento_de_Identificaci_n_Alfanum_rico; contact = -----redacted------.get_crm_contact_by_id(id);

    • Making "All Day Events" not default

      When I go to schedule an event, the All Day checkbox is ticked by default. Generally, I don't plan all day events, so is there a way to make that not checked by default? I couldn't find a setting for this...

    • Create custom field in multiple modules

      I am trying to create some custom fields that will be in both leads and contacts module without having to create them separately and then mapping them. How is that performed? it is too time-consuming to create 20+ fields and then do the same thing in a different module when they carry the same info. The idea is that when we get a lead from web site, there are items that we capture and once that lead is a client and moved to Contacts, that info should come over. So trying to find an easy way to create

    • Allow 2 logos for Branding, one for Light Mode and one for Dark Mode?

      Our logo has a lot of black text on it. If we leave the background transparent, per recommendation of Zoho, when a user is viewing a file and turns on dark mode, our logo is not really visible and looks really weird. It would be really great if we could

    • Compensation | Salary Packages - Hourly Wage Needed

      The US Bureau of Labor Statistics says 55.7% of all workers in the US are paid by the hour. I don't know how that compares to the rest of the world, but I would think that this alone would justify the need for having an hourly-based salary package option.

    • In Desk KB article, how do include an image in a numbered list without using a number or bullet?

      We need to include images in our KBA steps as a numbered list. Here I have numbered steps. I want the image no numbering or bullet. Open Purchase Order Entry. Select the mail icon: Select the Save button. I see your own articles have images in number

    • Video Interview features

      I tested the video interview feature. It's supported only on desktop version of chrome/firefox. Most of the times, the candidates are available on their cellphone. Need to have this for mobile devices too.

    • POS and payments

      Have i missed the point can i not use zoho POS as a payment terminal back into stripe like we can in Books?

    • Delugeサーバーページ(HTML)での関数の使用方法

      Zoho Creator、Deluge並びに初心者です。 題名の通りDelugeサーバーページ(HTML)で関数が使用する方法を教えて頂きたいです。 ざっくりと説明します。 現在、1週間だけカレンダーを表示するページをelugeサーバーページ(HTML)内で作っております。 カレンダー内のボタンには翌週や先週を表示するボタンを追加しようとしています。 それらのボタンを押下した際、現在の日時に±７日をしてページを表示しなおす処理が走るようにさせたいです。 ボタンが押下されたとき、用意していた関数でその処理を実行する想定です。

    • Automatically remove commas

      Team, Please be consistent in Zoho Books. In Payments, you have commas here: But when we copy and paste the amount in the Payments Made field, it does not accept it because the default setting is no commas. Please have Zoho Books remove commas autom

    • Why does my salesiq dashboard doesn't look like the one on the admin guide?

      https://help.zoho.com/portal/en/kb/salesiq-2-0/for-administrators/setup-brand/articles/setting-up-the-website-channel#Launcher

    • ENDPOINT ZOHO CREATOR

      I created a function to perform the action of POST, GET and PUT in order to use it outside our portal and create more dynamic forms using a cloud server. Params = “qAvhbBBJJsQysd45DdkvTR34A” Curl = “https://www.zohoapis.com/creator/custom/admin2844/vallesalud_julaje_private?publickey=”;

    • MCP > Creator connection failing with Claude

      I'm trying to get claude to access any of my Zoho Creator apps and it keeps failing. I have enabled all tools for creator and ensured in claude settings that everything is authorised. Here is what claude says : Unfortunately, the error messages I'm receiving

    • Gantt Chart - Multiple Projects

      Hello, I have about 6 projects set up in Zoho and I am looking to see if it is possible to see all my projects on one gantt chart? Thanks Alex

    • milestone dependencies

      It would be exceptionally useful to be able to assign dependencies on milestone/tasks. For example, if within a project I have three milestones for creating three ads for publication, but each ad also requires the logo to be finished by the graphic designer (a separate milestone), it would be useful to have the start dates of the later items dependent on another prerequisite component. That way, not only would I not have to enter the logo creation as a separate task for each of the three milestones,

    • Need Easy Way to Update Item Prices in Bulk

      Hello Everyone, In Zoho Books, updating selling prices is taking too much time. Right now we have to either edit items one by one or do Excel export/import. It will be very useful if Zoho gives a simple option to: Select multiple items and update prices

    • Upgraded sentiment analysis model for more accurate detection

      Hello everyone! Sentiment Analysis in Zia is being upgraded to a newer model to improve how customer sentiment is detected and interpreted. This transition is aimed at getting better contextual understanding across all supported channels. As part of this

    • Notebook Al

      Why was our organisation's Notebook AI disabled, even though our admin said it wasn't done on their side?

    • Dashboard Filtering with 2 query tables using one filter field

      Hi There, I have been using user filters on the dashboard and for the most part they are fine. However I have one issue I would like to see if there is a fix for it. I have a main query that most of my widgets use. Then I have a second query for another widget. The dashboard uses the field "brand" in the main query for the filter.  The second query uses the main_query.brand field alongside fields from a second table. I have set the widget to use main_query.brand as a filter, but when the dashboard

    • How to get static reports via Desk API

      Hello, we are hoping to use the Desk API to automatically export the default static reports in Zoho Desk, or reconstruct them via other API calls. What's the best way to do this? For example, if I want to recreate the Response Time static report via the

    • What's New in Zoho POS - April 2026

      Hello everyone, Welcome to Zoho POS’s monthly update, where we share our latest feature updates, enhancements, events, and more. Let’s take a look at how April went. Access and manage other web applications in Zoho POS with Web Tabs You can now access

    • Issue with adding “Roblox” as an answer option in Zoho SurveyО

      Hello Zoho Support Team, I’m experiencing an issue while editing a survey in Zoho Survey. For some reason, I’m unable to add “Roblox” as an answer option. The same issue occurs with any answer option that contains this exact combination of letters, regardless

    • How to import MBOX to Gmail?

      In order to import or restore MBOX file backup Gmail account you can go for Advik MBOX to Gmail Import utility. This utility will import MBOX to Gmail or G Suite account without any configuration. This tool is considered as the most easiest and simplest process to perform email migration. Key Feature of this tool Import MBOX to Gmail in Bulk Maintain folder struture Retain Key elements Single Panel Interface 100% accuracy rate Download source : http://www.adviksoft.com/mbox/gmail.html

    • Free webinar! Accelerate deals with Zoho Sign for Zoho CRM and Bigin by Zoho CRM

      Hello, Paperwork shouldn’t slow you down. Whether you’re growing a small business or running a large enterprise, manual approvals and slow document turnaround can cost you time and revenue. With Zoho Sign for Zoho CRM and Bigin by Zoho CRM, you can take

    • Automatically set the default VAT percentage on a quote

      Every time I create a quote, I have to manually adjust the VAT and activate the checkbox for 21%. But all of our quotes include 21% VAT. So now occasionally, it happens that the checkbox is forgotten, and the customer receives an incorrect quote (without

    • Don't understand INVALID_REQUEST_METHOD when I try to post up an attachment

      When I make the POST request (using python requests.post() for files): https://www.zohoapis.com/crm/v8/Calls/***************01/Attachments I get this response: r:{ "code": "INVALID_REQUEST_METHOD", "details": {}, "message": "The http request method type

    • Bigin & Booking. Associate the appointment with existing customers in bigin.

      I tried to change the stage of the pipeline associated to a existing contact after he book a appointment in Booking. I use flow to create a event in booking when a appointment is done. But.... How can I relate the appointment with the existing contact

    • Can Zoho Books support an Asset account as an item's purchase/COGS account? (Prepaid reseller use case)

      Hi everyone, I run a prepaid digital plan reseller business where I fund a vendor account upfront and draw it down as I make sales — essentially a float-based model, similar to a gift card or prepaid airtime reseller. The correct accounting treatment

    • Quotes - Freehand line items - zoho crm

      Hi, In the zoho crm quotes module is it possible to add line items that are freehand typed? We have a business need to use the quotes module but the product nams/description, quantity, price, etc. needs to be freely typed rather than from a defined list

    • TDS Payable report not Generating

      TDS Payable report for Last Quarter of FY 25-26 is not generating and giving error. Please get it rectified as soon as possble.

    • Remove Zoho Header from Portals

      I have a portal page with custom domain. But when I print directly from a webpage, the Zoho CRM header shows. It kind of kills the branding aspect. Is there a way to get rid of this?

    • Next Page