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

        • Using Insert into to transfert a date in another form

          Hi, I have an order form that creates a record in a calendar form, for managing the delivery date. My customer can change that date in the calendar form, but i need the new date to be put in the original order form. I tried the following but it doesn't
        • CASE Module - email function

          HI there, I dont know if this has been asked or answered before as i couldnt find it on the forums. Issue: when a new case is raised, it goes under case tab and everything is captured. Then how do i send emails to the client who raised case with the details
        • Does Zoho US Payroll now support employees in multiple states?

          Does Zoho US now support having employees in multiple US states? I looked at the site and can't find and of the restrictions on multiple states anywhere.
        • Last Name / First Name

          Hello ,  My company adds contacts on a "Last Name , First Name" basis. We've noticed that when viewing accounts there is no  " , " (comma). It's VERY misleading.  I have set the custom view to show "last name" "first name" instead it joins them both and merges them. Even after you create a contact and you re enter it states "contacts name" instead of "last name" , First name" I have already changed the arrangement of name display in user settings. We need to be able to distingush name orders. Attached
        • Desk Contact Name > split to First and Last name

          I am new to Zoho and while setting up the Desk and Help Center, I saw that new tickets created or submitted from the Help Center used the Contact Name field. This would create a new Contact but put the person's name in the Last Name field only. The First
        • Extract first and last name

          I am trying to build a custom function in Flow, when a new Zoho Booking is added I want to split the Name field into first last name.  I understand the function needs to be a string and this works but I am unsure how to write this in the flow script.  result = first_name.getPrefix(" "); info result; I also assume to then create the last name Ill use the same but getSufix  Any help greatly appreciated.  :-)
        • Import template from Zoho Writer

          I am trying to import a mail merge template - tried to import direct from my .docx file on my hard drive and the formatting went all over the place.  I then imported the .docx file in my Zoho Docs and then fixed up the formatting within Zoho Writer. Can I now import that template directly from Zoho Docs into my templates in Zoho CRM??
        • Introducing the New SalesIQ Live Chat Widget: Twice as Fast, Fully Optimized for Engagement!

          Hello everyone! To celebrate our 10-year milestone, we're thrilled to unveil the new and improved SalesIQ Live Chat Widget! Redesigned at both the User Interface and performance levels, this enhanced widget is not only optimized but also 2X faster than
        • Passing Information from ZohoCRM to ZohoCreator

          I've got a use case where I'm attempting to use a button within ZohoCRM to pull a list of options into buttons on creator when page is loaded. I'm pretty well versed in Deluge, but I'm having a difficult time trying to understand how to dynamically place
        • How do I connect a Google Cloud Project as a Custom Service

          How can I connect a Google Cloud project as a custom service to ZohoCRM? I need to pull YouTube Analytics data into CRM, but I cannot use the included YouTube service as it does not have the scopes I need. Therefore, I need to create a custom service.
        • Member Portal with Subscriptions

          We are a subscription box business using Zoho One.  How do our members login to make changes to their subscriptions, contact details, etc.  Is there a portal?  If not, what should we do to create one?  Also, we must be able to customize the portal with tabs and custom fields.  Finally, we need form and survey information to show up in the portal with some items editable and others read only.  I really need this information soon.  Thank you! Paige
        • How to select alternate invoice email notification template

          When we reissue an invoice, we want to send a different notification email. I am able to set up the alternate email body using Email Notifications/Invoice Notification settings, but I can't figure out how to attach that template to a specific invoice.
        • Rearrange web - hidden components

          When you have a good number of forms, reports and pages, searching for one among the hidden components to add it to the menu is simply hell. Huge amounts of time are wasted.
        • Telegram -> Zoho Creator answer via API.

          Hello! Did anyone work or established back connection from Telegram to Zoho Creator via API? I'm able to send notification from ZC to TG Bot successfully. (webhook is set) My notification consists of some information and inline buttons "yes" and "no".
        • How Can I Easily Access and Manage My GEPCO Online Bill Using Zoho Sheets?

          Hello everyone, I'm looking for an efficient way to access and manage my GEPCO online bills. I've heard that Zoho Sheets can be a powerful tool for organizing and tracking bills, but I'm not sure how to set it up for this specific purpose. Does anyone
        • Update a form record based on another form with same user ID

          Hi, I have 2 forms linked : Customer and Subscription When a customer fills-in a subsequent subscription form, there is a automatic subscription number created in the subscription form that I want to paste in a miroir field in the customer field. What
        • Notes Filter is not working

          I am trying to filter the CRM down to specific notes that I want that'll show up all the data that has a specific keyword for example, "stocks" and it says no leads are found... Don't know how to fix. don't know if it's a system glitch. I even put a note
        • How to Initiate WhatsApp Message on SalesIQ?

          I've just activated a Business WhatsApp phone number through SalesIQ because of its touted omnichannel chat approach. Sounds exciting. I understand that when a customer sends me a WA message, I can reply to it on SalesIQ and keep the chat going, perfect.
        • E-mails to suppliers

          Hi, i want to upload a spread sheet every day and send an e-mail to our suppliers every day (or when triggering a button?) with info from the spreadsheet lines. The supplier e-mail would be on each line. Unfortunately, when creating a scheduled automation,
        • How can I transfer data from Production to Development environment?

          Hi, I am using Creator V6 and would like to bring all the data in production to the Development and Testing environments? Is there an easy way of doing that or I have to export and import each table?
        • Issue Configuring SSO Integration with Cognito in Zoho Help Center

          Dear Zoho Support Team, We have been working on configuring SSO integration for our Zoho Help Center using Amazon Cognito. While the setup appears to be completed successfully, we are encountering an issue when attempting to access the Help Center. The
        • Custom Roles & Granular Permission Control in Zoho SalesIQ

          Hello Zoho SalesIQ Team, We appreciate the functionalities offered by Zoho SalesIQ, but we would like to request a crucial enhancement regarding user roles and permissions. Current Issue: At present, Zoho SalesIQ provides fixed roles—Admin, Supervisor,
        • Zoho Creator Upcoming Updates - October 2023

          Hello all! As we step into the final quarter of this year, we're ushering in a fresh wave of improvements and new features to supercharge your experience with Zoho Creator. Join us today as we present the newest updates and enhancements for this month:
        • Sales without an invoice

          Sales without an invoice is not included on the “payments received” report. Also, sales without an invoice is not listed in the transactions under the customer’s profile, also making it easy to do a double entry. Is there a way for me to see my sales
        • Rebrand your CRM with the all-new custom domain mapping setup

          UPDATES TO THIS FEATURE! 19th Jan, 2024 — Custom domain mapping has been made available for portal users in Zoho One and CRM Plus. 23rd June, 2023 — Custom domain mapping has been made available for all users, in all DCs. Hello everyone! We are elated
        • Nested Sub-forms (Subform within subform)

          Hi Team, Whether there is any possibilities to add sub-form with in another sub-form like Main Form       -> Sub form A             ->Sub form B If we tried this, only one level of sub form only working.  Any one having any idea about this? Thanks Selvamuthukumar R
        • Enhancements to the formula field in Zoho CRM: Auto-refresh formulas with the "Now" function, stop formula executions based on criteria, and include formulas within formulas

          Dear Customers, We hope you're well! By their nature, modern businesses rely every day on computations, whether it's to calculate the price of a product, assess ROI, evaluate the lifetime value of a customer, or even determine the age of a record. With
        • Zoho CRM Kiosk Upload Files

          Hello all, We are trying out Kiosks at the moment to see where it can fit best in our business. We are still a bit off in the application but lets say we will sort this out. My question is the following - when I create a Kiosk I can add "File Upload"
        • Delay Function

          Hello, I would like to emphasize the importance of incorporating a delay functionality within custom functions, particularly in the context of integrating multiple platforms. As I understand, a delay function is not available by default in Zoho. However,
        • Client Script | Update - Introducing Subform Events and Actions

          Are you making the most of your subforms in Zoho CRM? Do you wish you could automate subform interactions and enhance user experience effortlessly? What if you had Client APIs and events specifically designed for subforms? We are thrilled to introduce
        • Whatsapp Connection Status still "Pending" after migration

          Hello, I migrated my WhatsApp API to Zoho from another provider a day ago. So far the connection status is still “Pending”. There is a problem? How long does it usually take?
        • Marking a Desk ticket as Unread after merge

          We have a custom script that runs against every new ticket and auto-merges it with any existing ticket that matches our criteria. That works fine but there is no functionality that reverts the newly-updated ticket back to an "unread" state. I found the
        • How to add a customized/dynamic Zoho Booking link in email footer?

          We just installed the latest version of the Zoho Desk <=> Zoho Booking extension from the marketplace and are quite happy to see the feature where a ticket-specific appointment booking link can be inserted in a reply. Is there any way to configure this
        • Date Time

          Hi Everyone, I would seek some help about this concern that bugs me. I'm currently working using Zoho Flow to automatically plot a calendar on the Calendar Report. Whenever a ticket from Zoho Desk Field was updated this will trigger to create a plotted
        • How to change contact record owner to its creator?

          When I convert a lead record into a contact and a deal then a the contact record will have User AAAA as record owner, and the contact record will have User XXXX as the record creator. I don't have any workflow rules in Contact module. I use the blueprint
        • Custom function inside a CUSTOM BUTTON - BOOKS CUSTOM MODULE

          I am trying to upload the attachment in a custom module(Books) to a work drive. One module is working, but another module(New) is not giving me the desired result as it is also giving an error. Of course, I changed the module name etc. Attaching the script
        • Function to update field in CRM Meetings from Bookings Appointment Status

          Hello, We're creating some reporting in Zoho Analytics using data from CRM and Bookings. Unfortunately it looks like when Bookings Appointments are carried over to CRM Meetings, the Bookings Appointment Status is not recorded in CRM Meetings. We would
        • Introducing Bot Filtering for Accurate Email Campaign Analytics

          Update : This feature has been revamped. For the most current information and improved functionalities, please visit the updated version here. Dear Marketers, We're excited to announce a new feature designed to enhance the accuracy of your email campaign
        • Zoho Meeting very bad video quality

          Hello, I need 1080p HD on my Zoho Meeting as explained here: Low Resolution/Quality Video (zoho.com) Currently, video quality is lagging with 400mb internet which is not acceptable for my business. My 1080p 60FPS webcam performs well on platforms like
        • Zoho CRM Calendar View

          Hello Zoho team, We need desperately a calendar view next to list, kandan and other views. I think it should be easy to implement as you already have the logic from Projects and also from Kanban View in CRM. In calendar view when we set it up - we choose
        • Next Page