Building Extensions #15: Creating widgets with the JS SDK bundle in Zoho Desk—Inter-widget communication

Building Extensions #15: Creating widgets with the JS SDK bundle in Zoho Desk—Inter-widget communication

This series aims to equip developers with all they need to build extensions for Zoho Desk in Zoho Sigma and publish them in Zoho Marketplace.

Hello Developers!

In our previous post, we briefed the use of Hooks API and explained it with an example on how to use them in a Desk extension. In this post, we'll learn about the inter-widget communication feature and how it can be used in your extensions with an example.

Inter-widget communication

There are scenarios where an extension could have multiple widgets. In such cases, it is important to have communication between these widgets for the extension to be more user-friendly. The inter-widget communication feature of Zoho Desk helps you create a connection between widgets and facilitate communication between them. When two widgets are communicating, there are a few points to remember during implementation. Let’s consider one widget as the sender and the other as the receiver.

Sender widget
  1. This widget should know the receiving widget's identity.
  2. When it knows that identity, it can send the desired data to the receiving widget.
Receiving widget
  1. This widget needs to be active to receive data from any sender.
  2. It can then process the received data.
You can achieve this with the help of a couple of SDK methods provided by the Zoho developer platform.
  1. App.instance.getWidgets(): The getWidgets() method will return an array of all the widgets available in the extension, including the one from where this call is made.
  2. siblingwidgetId: Every widget associated to the extension will have a unique ID. You can use the code widgets[0].widgetID to get the widget ID of the desired widget from the array of widgets available. The array index for the widget is defined based on the order in which the widgets are listed in the plugin-manifest file of the extension.
  3. var siblingWidget = App.instance.getWidgetInstance(siblingwidgetId): This returns the whole instance of the selected widget.
  4. siblingWidget.emit('event', data): This sends the data from the selected widget on the event occurrence.
Once we pass the data from the first widget (sender), we need to enable the other widget (receiver) to receive the event sent from the first widget. The following code snippet needs to listen to an event emitted by the sibling widget.

App.instance.on('event', function(data){});

Sender Widget
Receiving Widget
Need to know the receiving widget's IdentityNeed to be active to receive the data
Get the instance of the desired widgetReceive data and process it as required
Send the data

Let’s learn about inter-widget communication with an example.

Scenario

Consider a scenario where an agent is provided with detailed information about a particular customer within Zoho Desk itself that is easily accessible. Wouldn’t it be useful for the agents to understand the value of their customer easily? Yes, this can be done using an extension.
  1. Fetch the details of the customer from Zoho CRM.
  2. Showcase the required customer’s information in Zoho Desk.

Platform features

To implement the above scenario, the following Desk platform features are used.
  1. Background widget: This widget runs on its own in the background by default. In our use case, as soon as an agent opens a ticket, the customer's email ID needs to be fetched and the corresponding details are imported from Zoho CRM accordingly. In this case, we can use the background widget feature to fetch the data from Zoho CRM. This can be implemented using the background widget.
  2. Tickets subtab widget: In our example use case, we need the customer’s details to be shown to the agent. Let’s choose the ticket's subtab location to display the same.
  3. Inter-widget communication: Because there are two widgets being used, we can use the inter-widget communication feature for a seamless data flow between the two widgets.

Subtab widget

An agent opens a ticket. Now the background widget gets loaded by default. When the agent moves to the subtab widget to view the customer details, the subtab widget is loaded and we communicate to the background widget about the same. The customer data transferred to the subtab widget will be displayed to the agent.


Background widget

As soon as the background widget gets a communication from the subtab widget, the customer's details are fetched and transmitted back to the subtab widget.





We have attached the entire code of our sample in this post. You can download the same and reuse, if required.

Sample output



Hope you found this post to be useful. Stay tuned for more posts in this space!

See Also



    • Recent Topics

    • How to Retrieve Serial Numbers of Items in Zoho Inventory via API?

      Hello, I am currently working with the Zoho Inventory API and need to retrieve the serial numbers associated with specific items in our inventory. After reviewing the documentation, I couldn’t find an endpoint dedicated to fetching serial numbers for
    • merging email accounts

      previously I was using 5 mail pop mailboxes within VO , 2 of them are becoming obsolete so I was thinking about deleting the obsolete ones and merge the remainders into my main account mailbox within VO , is this possible ? thnx in advance.
    • ZohoPeople API - Retrieve leave type IDs

      Hi All, I have created a leave type in Zoho People UI. Now I need to fetch the  Leave Type ID of it. As per the documentation[1] I used the  curl request [2]. But I ended up with the error response from the API.  {"response":{"message":"Error occurred","errors":{"message":"Server Error Occured","code":7031},"status":1,"uri":"/api/leave/getLeaveTypes"}} The new API[3] does not tell anything on how to retrieve the Leave Type ID.  Have you done any changes to the API recently. If so please let me know
    • Inadequate Customer Support

      Hello & Greetings! I have been a pro Zoho user since the last 2 years and I would admit that the apps that are being offered are good, however the support we receive has a lot more to achieve. This being a design issue rather than a staff issue. Being
    • Incorrect Closing Stock Amount value

      Act as Zoho Inventory Expert. We are a construction company, OVAL Projects Engineering Limited. We started using Zoho Inventory for Stock Management.I have multiple warehouses. I have encountered a problem while generating custom warehouse wise inventory
    • The Next Chapter for CRM for Everyone: Moving from Early Access to Phased Rollout for Customers

      #CRM25Q1 Hello Everyone, Until now, CRM for Everyone has been available in early access mode exclusively for users who opted to try the new version. We are now transitioning to a phased release, starting with the basic edition. We are thrilled to announce
    • Zoho vault uses only password to unlock not a TouchID

      TouchID works when normally openning app but when called from keyboard while browsing or trying to log to another app it shows only password option to unlock. This behaviour is only on iPad Mini witch latest 18.2OS
    • Unable to add Guest Members

      We are having issues adding Guest Members to our Cliq account. We have sent out a number of request but it seems that only some people are able to access the platform. Others have received a message stating that they need to be granted access from an
    • Webhook when estimate is refused is not firing

      Hello, I use a workflow through make that sends estimate with zoho books (I paid books and sign). -Those estimates when accepted are firing the webhook that I create in zoho sign (photo 1) -However when refused they are not firing the webhook that I created
    • Invoice status on write-off is "Paid" - how do I change this to "Written off"

      HI guys, I want to write off a couple of outstanding invoices, but when I do this, the status of the invoices shows as "Paid". Clearly this is not the case and I need to be able to see that they are written off in the customer's history. Is there a way
    • Create a custom button to modify custom fields in zoho Inventory

      I am needing a script for two buttons, 1. Button will add todays date to a custom field named cf_sent_to_sov 2. Button will mark a checkbox or unmark a checkbox field named cf_parts_ordered I have been trying to figure out deluge but have not got anywhere
    • How to add a record for a different report

      I have one form and it has two reports I need to programmatically add records to both reports For example one report is draft and other is processed After the user performs some action on the draft report I want to create a new report in Processed and
    • Webhook 'when estimate is refused' is not firing

      Hello, I use a workflow through make that sends estimate with zoho books (I paid books and sign). -Those estimates when accepted are firing the webhook that I create in zoho sign (photo 1) -However when refused they are not firing the webhook that I created
    • Amazon Integration

      Hi, I am seller on Amazon , & I would like to sign up for Zoho books. However my question is can we automate/integrate invoicing, charges and returns in amazon with Zoho using API? Do you have a developer for this? I did take a look at zapier however it just has a create Invoice function nothing else.
    • Link project tasks to tasks in CRM and/or other modules.

      Hello, I have created and configured a project in Zoho Projects with a set of tasks. I would now like to link these tasks (I imagine according to the ID of each one) to actions in the CRM: meetings, tasks, analytics). The aim is to link project tasks
    • Count the NUMBER of Contacts for an Account automatically

      Hello. Is there any way Zoho can count the number of CONTACTS for a particular ACCOUNT and have a field in the ACCOUNT module update itself automatically? Currently we use Zoho to administer our language school and the Contacts represent students and Accounts represent Grupos (Classes). It would be very useful for us to have a feature like this enabled, and I can see other similar applications requiring something like this. The solution would be even better if the Contacts met a specified criteria,
    • How to use Twilio to send appointment notification and reminder SMS in Zoho Bookings

      Hit no-shows out of the ballpark by combining Zoho Bookings and SMS providers. SMS notifications help you remind customers of their appointments and reduce no-shows by reaching out where they are. In this guide, we'll configure an SMS provider called
    • geographic search filter in map view

      Hi, I have a recruiting and timesheet system built in Creator. The client wants to enhance the search for candidates based on their location and filter by job skills - currently they look on the Map View which uses the geo location or post code of the
    • Announcement: Upcoming changes to the permission grant flow for OAuth apps

      This announcement is intended for app developers who use the Zoho API console. We're going to implement an important update to the way users grant permission for the OAuth apps created through the API console. What’s changing? Currently, users can grant
    • Add Google Workspace Module to Zoho Flow

      Dear Zoho Flow Team, I hope this message finds you well. We’d like to request the addition of a dedicated Google Workspace module in Zoho Flow. Currently, there are no triggers or actions for Google Workspace, which limits our ability to integrate and
    • How do i remove the Powered by Zoho logo from my careers page

      Can I remove this? ​
    • Totals on Pivot Table

      Is there a way to change the way the subtotal calculates? In this example I have a formula to give me the average monthly attendance ....but I want the grand total of the month to be the sum of all the average attendances...any ideas? Thank you!@
    • Team Inbox is not working AGAIN

      I like Team Inbox in general. It makes using a collaborative inbox easy - when it works. The problem is that it doesn't work at times - and it seems to not work, a lot. It's not catastrophic failure, it's little things. Unable to send messages Unable
    • HOW TO USE ZOHO

      IDK
    • Zoho account sign in with passkey

      Hello, I am trying to sign in using passkey, but the option doesn't show up in the web and is disabled in Oneauth on mobile, saying the admin has restricted the use. On the Admin page in Security MFA I can find no option for passkey. Help would be greatly
    • Pivot table with Text values - "Matrix Report"

      User Story - As a user, I would like the ability to display textual data in a two-way table, matrix format (text datatypes, not numerical datatypes displayed as a dimension) One major feature missing from the Pivot tables in Zoho Analytics is the ability
    • Canvas View in Zoho Recruit

      Is it possible or would it be possible to have the new 'Canvas View' in Zoho Recruit?
    • Can Wisestamp email signature be use with Zoho mail?

      Does a Wisestamp email signature work with Zoho mail?
    • WiseStamp

      WiseStamp is an excellent social media signature tool. It integrated seamlessly into Gmail and Thunderbird, plus a few more. Are there any plans to get this incredible app integrated into Zoho. check it out here: http://www.wisestamp.com/ thanks Tim
    • Power BI connector (Zoho Creator) to Zoho Projects

      How can i connect power bi to Zoho Projects? domain is zoho.com How can i find workspace name, application link name and Report link name?
    • Update your Google connection with Zoho TeamInbox

      Dear all, Wishing you a Happy New Year! Google has recently updated its security policy to enhance user protection, requiring all third-party apps and services to use OAuth authentication and password-less login methods. This update impacts users who
    • Easy way to delete attachments

      I've reached my data limit and would like to run a view/report, and mass delete attachments. Is there an easy, fast way to do this? Moderation Update: Post Summary: There are two features the post discusses a) Easy way to remove Email attachments Will
    • Sites Speed and Performance Grades

      I noticed that there are no recent inquiries or complaints about load speed or performance issues with Zoho Sites websites. However, I wanted to understand what Zoho has done to ensure that speed remains optimized, images are compressed and lazy loaded,
    • Integrating Quotes with leads Information

      Our business requires giving a quote to a lead (not Account / Potential - as we define it differently). Currently, Zoho CRM's Quotes are integrated with Accounts / Potentials and not with Leads. Is there a way I could get the Lead information to the Quotes
    • Unknown error occurred

      Hi, When we want to publish or edit a page in our website, we encounter with "Unknown error occurred" problem. I share a screenshot here. Our website is www.essoft.com. It happens every page. We want to solve this ASAP.
    • Zoho one

      I am starting Zoho one as a beginner and there is Zoho crm and Zoho sales which i needed to work on but it appears in unassigned apps. What Should i do now?
    • Dialing Microsoft Teams Phone Service via Zoho CRM

      I am using the VOIP option in Microsoft teams for my office phone system. I was hoping to have a way to dial numbers directly from Zoho CRM, but don't see anything in the Teams Integration or in the Telephony integration that will enable this. Does anyone
    • Emailing lookup field but placing this as an ID or number rather than text

      Hi there, First time poster and have been a user of Zoho Creator for approx 6weeks so forgive my ignorance as I learn to code. We have a need to send an email to a specific email address with some of the fields triggered by the submission of a form. In
    • Search mails in shared mailbox

      Hi everyone, is there a way to search mails in shared mailbox's? Search in streams or mail doesn't return anything from mails in shared mailboxes. Thanks! Rafal
    • User Emails Blocked

      Community: I keep running into issues where our users stop receiving notifications from CRM because their email addresses get blocked in on the backend some how. I reach out to support, they confirm, they fix, and we carry on, but then it happens again.
    • Next Page