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
- This widget should know the receiving widget's identity.
- When it knows that identity, it can send the desired data to the receiving widget.
Receiving widget
- This widget needs to be active to receive data from any sender.
- 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.
- 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.
- 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.
- var siblingWidget = App.instance.getWidgetInstance(siblingwidgetId): This returns the whole instance of the selected widget.
- 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 Identity | Need to be active to receive the data |
| Get the instance of the desired widget | Receive 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.
- Fetch the details of the customer from Zoho CRM.
- Showcase the required customer’s information in Zoho Desk.
Platform features
To implement the above scenario, the following Desk platform features are used.
- 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.
- 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.
- 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
Create widgets using the JS SDK bundle in the Zoho Desk platform - Request API
Create widgets with the JS SDK bundle in Zoho Desk - Data Storage API
Create widgets with the JS SDK bundle in Zoho Desk - Data Storage API
Create widgets with the JS SDK bundle in Zoho Desk - Event API
Create widgets with the JS SDK bundle in Zoho Desk - Config Params
Create widgets with the JS SDK bundle in Zoho Desk - Resource API
Create widgets with the JS SDK bundle in Zoho Desk - Hooks API
Create widgets with the JS SDK bundle in Zoho Desk - Config Params
Create widgets with the JS SDK bundle in Zoho Desk - Resource API
Create widgets with the JS SDK bundle in Zoho Desk - Hooks API
<< Previous Next >>
Access your files securely from anywhere
New to Zoho Recruit?
Zoho Developer Community
New to Zoho LandingPage?
Zoho LandingPage Resources
New to Zoho Survey?
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Bigin?
Topic Participants
Vinoth M
Julien Bras
Ash | Zoho Desk
New to Zoho TeamInbox?
Zoho TeamInbox Resources
Zoho CRM Plus Resources
Zoho Books Resources
Zoho Subscriptions Resources
Zoho Projects Resources
Zoho Sprints Resources
Qntrl Resources
Zoho Creator Resources
Zoho CRM Resources
Design. Discuss. Deliver.
Zoho Show Resources
Get Started. Write Away!
Writer is a powerful online word processor, designed for collaborative work.
Zoho CRM コンテンツ
-
オンラインヘルプ
-
Webセミナー
-
機能活用動画
-
よくある質問
-
Ebook
-
-
Zoho Campaigns
- Zoho サービスのWebセミナー
その他のサービス コンテンツ
Nederlandse Hulpbronnen
ご検討中の方
Recent Topics
No practical examples of how survey data is analyzed
There are no examples of analysis with analytics of zoho survey data. Only survey meta data is analyzed, such as number of completes, not actual analysis of responses, such as the % in each gender, cross-tabulations of survey responses. One strange characteristic of Zoho analytics is that does not seem aware of how Zoho Survey codes 'multiple response' questions. These are questions where more than one option can be selected from a list. Zoho Survey stores this data as text, separated by commas withinUpdate application by uploading an updated DS file
Is it possible? I have been working with AI on my desktop improving my application, and I have to keep copy pasting stuff... Would it be possible to import the DS file on top of an existing application to update the app accordingly?Markdown support, code cells...
Hi Zoho I'd like to vote for a feature that markdown is supported with: Headings Code highlighting Quoteblocks ... Furthermore a inline card(like inline sketch card) for special text like Code would be great. And just to add my vote as well for "Tags"!Minimise chat when user navigates to new page
When the user is in an active chat (chatbot) and is provide with an internal link, when they click the link to go to the internal page the chat opens again. This is not a good user experience. They have been sent the link to read what is on the page.How do I fix this? Unable to send message; Reason:554 5.1.8 Email Outgoing Blocked.
How do I fix this? Unable to send message; Reason:554 5.1.8 Email Outgoing Blocked.Reports: Custom Search Function Fields
Hi Zoho, Hope you'll add this into your roadmap. Issue: For the past 2yrs our global team been complaining and was brought to our attention recently that it's a time consuming process looking/scrolling down. Use-case: This form is a service report withZoho Projects app update: Voice notes for Tasks and Bugs module
Hello everyone! In the latest version(v3.9.37) of the Zoho Projects Android app update, we have introduced voice notes for the Tasks and Bugs module. The voice notes can be added as an attachment or can be transcribed into text. Recording and attachingzurl URL shortener Not working in Zoho social
zurl URL shortener Not working in while creating a post in Zoho socialIn the Zoho CRM Module I have TRN Field I should contain 15 digit Number , If it Contain less than 15 digit Then show Alert message on save of the button , If it not contain any number not want to sh
Hi In the Zoho CRM Module I have TRN Field I should contain 15 digit Number , If it Contain less than 15 digit Then show Alert message on save of the button , If it not contain any number not want to show alert. How We can achive in Zoho CRm Using customPower of Automation::Streamline log hours to work hours upon task completion.
Hello Everyone, A Custom Function is a user-written set of code to achieve a specific requirement. Set the required conditions needed as to when to trigger using the Workflow rules (be it Tasks / Project) and associate the custom function to it. Requirement:-Zoho Bookings know-how: A hands-on workshop series
Hello! We’re conducting a hands-on workshop series to help simplify appointment scheduling for your business with Zoho Bookings. We’ll be covering various functionalities and showing how you can leverage them for your business across five different sessions.Custom report
Hello Everyone I hope everything is fine. I've tried to To change the layout of the reports, especially the summary page report, and I want to divide summary of each section in the survey but I can't For example: I have a survey containing five differentZoho Journey - ZOHO MARKETING AUTOMATION
I’ve encountered an issue while working with a journey in Zoho Marketing Automation. After creating the journey, I wanted to edit the "Match Criteria" settings. Unfortunately: The criteria section appears to be locked and not editable. I’m also unableCustom Fields in PDF outputs
I created a couple of custom fields. e.g Country of Origin and HS Tariff Code. I need these to appear on a clone of a sales order PDF template but on on the standard PDF template. When I select "appear on PDFs' it appears on both but when I don't selectHow to create a Service Agreement with Quarterly Estimate
Hello, I'm not sure if this has been asked before so please don't get mad at me for asking. We're an NDIS provider in Australia so we need to draft a Service Agreement for our client. With the recent changes in the NDIS we're now required to also includeChange Currency symbol
I would like to change the way our currency displays when printed on quotes, invoices and purchase orders. Currently, we have Australian Dollars AUD as our Home Currency. The only two symbol choices available for this currency are "AU $" or "AUD". I wouldPython - code studio
Hi, I see the code studio is "coming soon". We have some files that will require some more complex transformation, is this feature far off? It appears to have been released in Zoho Analytics alreadyZoho Social - Post Footer Templates
As a content creator I often want to include some information at the end of most posts. It would be great if there was an option to add pre-written footers, similar to the Hashtag Groups at the end of posts. For example, if there is an offer I'm runningAllow to pick color for project groups in Zoho Projects
Hi Zoho Team, It would be really helpful if users could assign colors to project groups. This would make it easier to visually distinguish groups, improve navigation, and give a clearer overview when managing multiple projects. Thanks for consideringZoho Books - Quotes to Sales Order Automation
Hi Books team, In the Quote settings there is an option to convert a Quote to an Invoice upon acceptance, but there is not feature to convert a Quote to a Sales Order (see screenshot below) For users selling products through Zoho Inventory, the workflowCan't find imported leads
Hi There I have imported leads into the CRM via a .xls document, and the import is showing up as having been successful, however - when I try and locate the leads in the CRM system, I cannot find them. 1. There are no filters applied 2. They are notCustom Button Disappearing in mobile view | Zoho CRM Canvas
I'm working in Zoho CRM Canvas to create a custom view for our sales team. One of the features I'm adding is a custom button that opens the leads address in another tab. I've had no issue with this in the desktop view, but in the mobile view the buttonThe connected workflow is a great idea just needs Projects Integrations
I just discovered the connected workflows in CRM and its a Great Idea i wish it was integrated with Zoho Projects I will explain our use case I am already trying to do something like connected workflow with zoho flow Our requirement was to Create a TaskZoho Projects MCP Feedback
I've started using the MCP connector with Zoho Projects, and the features that exist really do work quite well - I feel this is going to be a major update to the Zoho Ecosystem. In projects a major missing feature is the ability to manage, (especiallyFunction #10: Update item prices automatically based on the last transaction created
In businesses, item prices are not always fixed and can fluctuate due to various factors. If you find yourself manually adjusting the item rates every time they change, we have the ideal time-saving solution for you. In today's post, we bring you customemail template
How do I create and save an email templateEnhancements in Portal User Group creation flow
Hello everyone, Before introducing new Portal features, here are some changes to the UI of Portals page to improve the user experience. Some tabs and options have been repositioned so that users can better access the functionalities of the feature. FromArchiving Contacts
How do I archive a list of contacts, or individual contacts?How do I filter contacts by account parameters?
Need to filter a contact view according to account parameter, eg account type. Without this filter users are overwhelmed with irrelevant contacts. Workaround is to create a custom 'Contact Type' field but this unbearable duplicity as the information alreadyCan I add Conditional merge tags on my Templates?
Hi I was wondering if I can use Conditional Mail Merge tags inside my Email templates/Quotes etc within the CRM? In spanish and in our business we use gender and academic degree salutations , ie: Dr., Dra., Sr., Srta., so the beginning of an email / letterZoho CRM button to download images from image upload field
Hello, I am trying to create a button in Zoho CRM that I can place in my record details view for each record and use it to download all images in the image upload fields. I tried deluge, client scripts and even with a widget, but feel lost, could notemail moderation issue when email is sent in the name of a mail group
Symptom: an email that is sent by a mail group moderator in the name of a moderated mail group is held back for approval. Reproduction: Create a moderated mail group with members and moderators. Allow that mails can be sent in the name of the group (extended settings). Send an email to the group as a group moderator, but in the name of the group. This mail is held back for moderation which is unexpected. Expected: A mail sent by group moderator to a moderated group are not held back for moderationblank page after login
blank page after logging into my email account Thanks youIntroducing the revamped What's New page
Hello everyone! We're happy to announce that Zoho Campaigns' What's New page has undergone a complete revamp. We've bid the old page adieu after a long time and have introduced a new, sleeker-looking page. Without further ado, let's dive into the mainAlways display images from this sender – Is this feature available?
In Zoho mail, I had my "Load external images" setting set to "Ask me", and that's fine. That's the setting I prefer. What's not fine though is I always need to tick "Display now" for each email I get, regardless if I've done that multiple times from severalFunction #9: Copy attachments of Sales Order to Purchase Order on conversion
This week, we have written a custom function that automatically copies the attachments uploaded for a sales order to the corresponding purchase order after you convert it. Here's how to configure it in your Zoho Books organization. Custom Function: HitFree webinar: Security that works: Building resilience for the AI-powered workforce
Hello there, Did you know that more than 51% of organizations worldwide have experienced one or more security breaches, each costing over $1 million in losses or incident response? In today’s threat landscape, simply playing defense is no longer enough."Subject" or "Narration"in Customer Statement
Dear Sir, While creating invoice, we are giving in "Subject" the purpose of invoice. For Example - "GST for the month of Aug 23", IT return FY 22-23", "Consultancy", Internal Audit for May 23". But this subject is not coming in Customer Statement. OnlyApply Vendor Credit Automatically
Hello!!! Is there a way where in we can apply vendor credits automatically on the FIRST OUTSTANDING BILL of the vendor?? We have lots of VENDOR CREDITS ISSUES mostly!!! Applying it manually is a pain for us. Would be great if we have a way to apply theZoho Notebook Sync problem
I'm facing a problem with syncing of notebook on android app. It's not syncing. Sometimes it syncs after a day or two. I created some notes on web notebook but it's not syncing on mobile app. Please help!!!!Next Page