Kaizen #181 - Mandating Subform Data for Blueprint Transitions using Widget

Kaizen #181 - Mandating Subform Data for Blueprint Transitions using Widget



Hello Developers!

Welcome back to another week of Kaizen! 

This time, we are tackling a common challenge on how to enforce subform data from a different module before allowing a blueprint transition in Zoho CRM Deals module.

Many CRM workflows require checking and collecting related records' data across modules before advancing a deal, case, or order to the next stage. Zoho CRM Blueprint natively support subforms from Quotes, Sales Orders, and Invoices for the Deals module with the help of Associated Items in the transition settings. 

Let us explore how to mandate custom subforms' data from a different module for a blueprint transition.

Why Mandate Subform Data from a Different Module?

In Zoho CRM, subforms manage multiple data entries under a single parent record. However, certain blueprint transitions may depend on subform data from related modules, such as:  
  • A Deal's transition may depend on the document data stored in the associated Contact’s subform.
  • A Service Request requiring validation against a subform in the related Account before processing.  
  • A Loan Application requiring income proof from the Customer’s subform before approval.  
Since blueprint transition rules only validate fields within the same module, you can use a custom widget to check and update subform data across modules before proceeding.

Business Scenario: Insurance Deals Qualification

Consider Zylker, an insurance company, using Zoho CRM to manage customers and streamline processes. Their sales process follows this blueprint when a deal reaches the Qualification stage:
Insurance Sales Blueprint

Steps to Build a Blueprint Widget

Step 1 - Review Basics

Refer to our earlier Kaizen on CLI Installation, Creating a Widget Project, and Internal hosting of the same.

Step 2 - Develop your Widget

After setting up the widget project using CLI, implement the logic based on your business case.

Here’s the logic for the sample use case we are discussing:

Widget Execution During Transition
  • When the user clicks the Collect Requirements transition, the widget loads.
  • Using the PageLoad event listener, retrieve the current record's ID and module name.
  • Use the GET Records API via its JS SDK to fetch the Contact ID linked to the Deal. 
ZOHO.embeddedApp.on("PageLoad", function(data) {
      // Fetch the current page's record details
      const recordId = data.EntityId;
      const moduleName = data.Entity;
      ZOHO.CRM.API.getRecord({Entity: moduleName, RecordID: recordId})
        .then(function(response) {
          const record = response.data[0];
          console.log("Current Record Details:", record);
          // Fetch the associated contact ID
 contactId = record.Contact_Name.id;

Check and Collect Required Document Details
  • Using the Contact ID, run a COQL query using Connection JS SDK to check if each Document Category has at least one entry in the Document Details subform.
Notes
Notes
In invoke connection JS SDK, use param type 2 for the API request payload inside the parameter key and param type 1 for regular parameters.

Explore the Working with Connections help page and create a connection with the necessary scopes to invoke the COQL API.
  • If all four categories (Address Proof, ID Proof, Income Proof, Medical Report) have at least one entry, the widget allows the transition immediately.
  • If any category is missing, the widget prompts the user to enter the details in a table that mirrors the Document Details subform in the Contacts module.
// Make a query API call 
          const query = {
            "select_query": `select Document_Category,COUNT(id) from Document_Details where id is not null and Parent_Id='${contactId}' group by Document_Category`
          };
          ZOHO.CRM.CONNECTION.invoke("crm_oauth_connection", {
            method: "POST",
            url: "https://www.zohoapis.com/crm/v7/coql",
            parameters: query,
            param_type: 2,
            headers: {
              "Content-Type": "application/json"
            }
 }).then(function(response) {
     const data = response.details.statusMessage.data;
            if (response.details.statusMessage === "" || (data && data.length < 4)) {
              createSubformUI();
              document.getElementById('contentContainer').style.display = 'block';
            } else if (data && data.length === 4) {
              document.getElementById('messageContainer').style.display = 'block';
              // Enable the "Move to Next State" button if all files are already updated
              const nextStateButton = document.querySelector('.nextStateButton');
              nextStateButton.disabled = false;
              nextStateButton.style.backgroundColor = ''; 
            }
 })

Update the Contact's Subform
  • The user enters the document details and clicks the Save button in the widget. 
  • Since subform updates act like a PATCH request, any existing record IDs must be included in the update payload to retain them. To get the existing subform record IDs make a  GET Records API call via its JS SDK. 
async function getExisitingSubFormRecords(contactId) {
let exisitingRecords = [];
awaitasync function getExisitingSubFormRecords(contactId) {
let exisitingRecords = [];
await ZOHO.CRM.API.getRecord({ Entity: "Contacts", RecordID: contactId })
.then(function (response) {
const record = response.data[0];
console.log("Current Record Details:", record);

if (record.Document_Details)
{
record.Document_Details.forEach(function (document) {
exisitingRecords.push({id: document.id});
});
}
})
.catch(function (error) {
console.error("Error fetching records:", error);
});
return exisitingRecords;
} ZOHO.CRM.API.getRecord({ Entity: "Contacts", RecordID: contactId })
.then(function (response) {
const record = response.data[0];
console.log("Current Record Details:", record);
record.Document_Details.forEach(function (document) {
exisitingRecords.push({id: document.id});
});
})
.catch(function (error) {
console.error("Error fetching records:", error);
});
return exisitingRecords;
}
  • Clicking the Save button executes the following actions:
    -> Uploads the selected file to Zoho File System (ZFS) using the Upload File API through its JS SDK.
    -> Updates the Document Details subform in the associated Contact record by adding the file ID from the upload response and each row's entry using the Update Records API (via the Update Record JS SDK).
  • Once the subform is successfully updated, the widget allows the transition to next Blueprint state.
async function updateRecord(event) {
event.preventDefault();
// Collect user entries from each row
const rows = document.querySelectorAll('#documentsTable tbody tr');
const documentDetails = await Promise.all(Array.from(rows).map(async (row, index) => {
const documentCategory = row.querySelector('select[name="documentCategory"]').value;
const documentNumber = row.querySelector('input[name="documentNumber"]').value;
const documentName = row.querySelector('input[name="documentName"]').value;
const documentFile = row.querySelector('input[name="upload"]').files[0];
const fileId = await uploadFile(documentFile);
return {
Document_Category: documentCategory,
Document_Number: documentNumber,
Document_Name: documentName,
Upload: [
{
file_id: fileId
}
]
};
}));
// Get the existing subform records
const existingRecords = await getExisitingSubFormRecords(contactId);
// Merge the existing records with the new records
existingRecords.forEach(record => documentDetails.push(record));
// Prepare the payload for the update API call
const payload = {
id: contactId,
Document_Details: documentDetails
};
// Make the update API call
ZOHO.CRM.API.updateRecord({
Entity: "Contacts",
APIData: payload
}).then(function (updateResponse) {
console.log("Update response:", updateResponse);
const saveButton = document.querySelector('.saveButton');
saveButton.textContent = "Saved";
saveButton.disabled = false;
saveButton.style.backgroundColor = 'grey';
// Enable the "Move to Next State" button after saving
const nextStateButton = document.querySelector('.nextStateButton');
nextStateButton.disabled = false;
nextStateButton.style.backgroundColor = ''; 
})

Step 3 - Validate and Pack the Widget

  • Follow the steps given in the Widget help page to validate and package the widget.
  • Go to Zoho CRM > Setup > Developer Hub > Widgets and click Create New Widget.
  • Fill in the required details as shown in this image and ensure to select Blueprint as the widget type.
    Creating a Blueprint Widget

Step 4 - Associate the Widget with the Blueprint

  • Navigate to Setup > Process Management > Blueprint and open the Deals Blueprint created for this use case.
  • Click on the Collect Requirements transition.
    Associate Widget to a Blueprint Transition
  • In the During tab on the left pane, select Widgets and associate the newly created widget.
  • Publish the Blueprint to activate the changes.

Try it Out! 

A complete working code sample of this widget is attached at the bottom of this post for reference. 
 
Now, let us see how this Blueprint works from the Deals page:  
  1. All required document details are available: The widget validates the Contact’s subform and allows the transition.  



  2. Missing or incomplete document details: The widget prompts the user to enter the missing details, updates the Contact’s subform, and then enables the transition.  



This approach ensures that required subform data from another module is validated and captured before proceeding with a Blueprint transition.  

Would you like us to address any of your pain-points or have a topic to discuss? Let us know in the comments or reach out to us via support@zohocrm.com.

Until next time, Happy Coding! 

---------------------------------------------------------------------------------------------------------------------------------------

Additional Reading

---------------------------------------------------------------------------------------------------------------------------------------


Info
More enhancements in the COQL API are now live in Zoho CRM API Version 7. Check out the V7 Changelog for detailed information on these updates.

    • Sticky Posts

    • 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

    • Kaizen #152 - Client Script Support for the new Canvas Record Forms

      Hello everyone! Have you ever wanted to trigger actions on click of a canvas button, icon, or text mandatory forms in Create/Edit and Clone Pages? Have you ever wanted to control how elements behave on the new Canvas Record Forms? This can be achieved

    • Kaizen #142: How to Navigate to Another Page in Zoho CRM using Client Script

      Hello everyone! Welcome back to another exciting Kaizen post. In this post, let us see how you can you navigate to different Pages using Client Script. In this Kaizen post, Need to Navigate to different Pages Client Script ZDKs related to navigation A.

    • Kaizen #210 - Answering your Questions | Event Management System using ZDK CLI

      Hello Everyone, Welcome back to yet another post in the Kaizen Series! As you already may know, for the Kaizen #200 milestone, we asked for your feedback and many of you suggested topics for us to discuss. We have been writing on these topics over the

    • Recent Topics

    • Hide "Section" headers when using a form as a subform in "List view"

      When using a form as a subform and setting the "View Type" to "List View" it is not possible to hide the section headers. This can become an issue if I have a section which is not applicable to this subform and I hide the fields within that section and

    • Add additional field to quick search results

      IN the advanced search, we can add any field to the columns. In the regular search results (before you press enter, there is no option to modify the results. It would be super useful to include a custom field where it currently displays the pipleine

    • Need Help: Updating Related Records via Subform Entries in Zoho Creator

      Hi everyone, I’m trying to set up a workflow in Zoho Creator where each row in a subform updates related records in another form automatically. Here’s the situation: My main form (e.g., “Receipts”) contains a subform where each row selects a related record

    • Disable signing in using email aliases?

      Hi, I currently have user accounts that have multiple aliases, for example: Main: name@domain.com Alias: alias1@domain.com, alias2@domain.com Currently, I am able to use any of those 3 emails in the 'username' box during login, and it will log me into the email. Is there a way to setup so that email aliases cannot be used to sign on? I'd still be able to receive and send emails using those aliases in the main email account like it works now, except only the main email can be used to login. Cheers!

    • Zoho Desk - Community - Customer Portal - Description Field UX Improvement

      Hi Zoho Desk Team, As a prolific user of Zoho Cares Community, I find it very frustrating that I cannot increase the size of the Description box (this one which I am typing this message). Many apps with multi line text fields have a small handle in the

    • Add the same FROM email to multiple department

      Hi, We have several agents who work with multiple departments and we'd like to be able to select their names on the FROM field (sender), but apparently it's not possible to add a FROM address to multiple departments. Is there any way around this? Thanks.

    • Can I change the format of the buttons in the email templates?

      Hi all! We have been working hard trying to brand our email templates, and have some way to go yet. One of the things we can't seem to edit is the green ${Cases.CUSTOMER_PORTAL_BUTTON} button and the font of the View Ticket text. Is there any way of doing

    • Lead to Contact Conversion with multiple email address fields

      We are a B2C business with a strong repeat cycle, and as such it's not uncommon for customers to use multiple email addresses with us. We have both our Contacts & Leads modules set up with 3 email fields. (Primary Email / Secondary Email / Historic Email)

    • Does Thrive work with Zoho Billing (Subscriptions)?

      I would like to use Thrive with Zoho Billing Subscriptions but don't see a way to do so. Can someone point me in the right direction? Thank you

    • Exporting Charts from ZohoCRM

      Hi...I'm relatively new to ZohoCRM, but very happy with it so far. I have all my leads and potentials accurately entered, and like the reports that I can view, with charts at the top of the data. But when I export the data, I'm receiving only the data, whether I export as excel, csv or pdf. How can I export both the chart and the data? In case it makes a difference, I'm using the free version right now. I tried researching the other editions to see if a paid version of the software offered the ability

    • Automatically Update Ticket Status in Zoho Desk Based on Actions in Zoho Projects

      Hi Zoho Desk Team, Hope you’re doing well. We’re using the Zoho Desk–Zoho Projects integration to manage tasks related to customer tickets, and it works well for linking and tracking progress. However, there are a few important automation capabilities

    • sms long credits

      I’m trying to purchase Long Code credits so I can send SMS campaigns to my contacts. However, when I click the “Buy Now” button, the page appears blank and doesn’t load any purchase options. Could you please assist me in purchasing the Long Code credits

    • Tip #48- Power Your AI Workflows with Zoho Assist on Zapier’s MCP- 'Insider Insights'

      We’re thrilled to announce that Zoho Assist is now part of Zapier’s Model Context Protocol (MCP), bringing remote support automation right into your AI ecosystem. What is MCP? The Model Context Protocol (MCP) is Zapier’s new framework designed to connect

    • Insert Cookie Policy in Zoho Sites

      Hello, i need to insert a banner on my site because i'm in Italy so i have to respect EU laws for Cookie Policy and Privacy Policy. I see that i need to insert a code in <head> section of my site to show a banner/popup with cookie info. How i can do this? Thank you Luca

    • Marketing Tip #1: Optimize item titles for SEO

      Your item title is the first thing both Google and shoppers notice. Instead of a generic “Leather Bag,” go for something detailed like “Handcrafted Leather Laptop Bag – Durable & Stylish.” This helps your items rank better in search results and instantly

    • Customer Parent Account or Sub-Customer Account

      Some of clients as they have 50 to 300 branches, they required separate account statement with outlet name and number; which means we have to open new account for each branch individually. However, the main issue is that, when they make a payment, they

    • Forced Logouts - Daily and More Frequent

      In the last month or so, I've been getting "power logged out" of all of my Zoho apps at least daily, sometimes more frequently. This happens in the same browser session on the same computer, and I need to re-login to each app separately after this happens.

    • ENTER key triggering Submit

      Is it possible to stopped the ENTER key from the mandatory triggering of the Submit button on Creator form? I want forms submitted "ONLY" when the Submit button is pressed. 

    • Is it possible to assign Client user to external task ON PROJECTS' TEMPLATES?

      Is it possible to assign Client user to external task ON TEMPLATES PROJECTS?

    • Cliq does not sync messages after Sleep on Mac

      I'm using the mac app of Cliq. When I open my mac after it was in sleep mode, Cliq does not sync the messages that I received. I always have to reload using cmd + R, which is not what I want when using a chat application.

    • Link to images

      I have added images in pages. I would like to link those images with linked in URL so that they open in new window. There is an option of image -> link but I am not able to use the same to open URL in new window. Please check the attached image. Can you

    • Canvas View - Print

      What is the best way to accomplish a print to PDF of the canvas view?

    • Respond faster and smarter with Zia in your IM Inbox

      You’re in the middle of a busy chat queue. New messages keep popping up. One customer sounds upset. Another is asking a long list of questions. You need context. You need speed. You need help. That’s exactly when Zia Insghts jumps into action. It shows

    • Meeting impossible to use when sharing screen

      he Meeting tool in Brazil is practically unusable when sharing anything, whether it’s a presentation or simple navigation. When accessed via Cliq, the situation gets even worse: even basic calls fail to work properly, constantly freezing. And as you are

    • WARNING : Smart list automatically unsubscribes your contacts.

      I created a smart list of my team members based on the criterion that their email domain was @_____. The list refreshed as expected — but it ended up unsubscribing almost all members of my team. I contacted support, but it took two months to get a reply,

    • 5名限定 課題解決型ワークショップイベント Zoho ワークアウト開催のお知らせ (10/31)

      ユーザーの皆さま、こんにちは。Zoho ユーザーコミュニティチームの中野です。 10月開催のZoho ワークアウトについてお知らせします。 今回はZoomにて、オンライン開催します。 参加登録はこちら（無料）：https://us02web.zoom.us/meeting/register/BGYTysOnSqa9LA9eY2IKww ━━━━━━━━━━━━━━━━━━━━━━━━ Zoho ワークアウトとは？ Zoho ユーザー同士で交流しながら、サービスに関する疑問や不明点の解消を目的とした

    • Subforms in Stateless Forms

      Stateless Forms are very useful, but we can't build complex data entry pages without Subforms. Can this be implemented? This would make Stateless Forms truly powerful.

    • Custom Function not getting package details when triggered from Workflow Rules.

      I have a custom function for Packages that submits a form in our Creator app that we use to generate custom shipping labels (internal staff complete deliveries so we cannot generate shipping labels straight from Inventory). When the function is executed

    • Billing Preferences per Account

      Hello, We are trying to setup Billing Preferences in Zoho Desk to set up a different pricing per account. We charge different pricing per hour per customer/account. Account A = 100 per hour Account B = 125 per hour In the Billing Preferences in Time Entry

    • Time entry preview for custom time entry templates.

      Our company needed time entries in a specific format to document our client interactions. Since we are using a custom time entry layout, we have lost the "preview" on the time entry tab. Using the default time entry layout, you get a small preview of

    • Able to change project on timelog entries

      Ability to move the timesheet entry from one project to another. When a user adds a wrong entry a manager can change/update the timesheet entry to the correct project.

    • Knowledge base: The nitty-gritty of SEO tags

      A well-optimized knowledge base with great SEO can benefit your company by allowing customers to find help articles and support resources using search engines. This enables customers to quickly and efficiently find the information they need without direct

    • Full Text Customization & Translation in SalesIQ Chat Widget Settings

      Dear Zoho SalesIQ Team, Greetings, We would like to request an important enhancement to the chat widget customization options in Zoho SalesIQ. Current Limitation: At the moment, only some of the text shown in the chat widget is editable or translatable

    • Introducing swipe actions in the Zoho CRM Android app

      Hello everyone, How much time do you spend each day on your list view? Probably quite a lot. Since it's such an important part of your work, wouldn't it be easier if you could take action directly from your list view instead of opening each record one

    • Content Security Policy

      Is there a place in ZOHO CRM to add a Content Security Policy to allow for a call to a google.com map, from inside our current app? Or, how do I resolve the issue below?? jquery.js:1 Refused to load the script 'https://maps.google.com/maps/api/js?v=3.41&libraries=places&sensor=true&key=AIzaSyAyQzKeKSbLci4LwZhn9oXvtCkbUo1Ae4g&callback=map_loader'

    • Option to select location?

      As a business coach, I meet with clients at various public locations. I have two or three pre-determined locations that I meet at. I would like the client to choose the location when booking an appointment. Is there a way to do that with a single service, or is the best way to accomplish this by creating one service for each location offered?

    • Unified WhatsApp Number Management in Zoho Desk and SalesIQ

      Dear Zoho Desk Support Team, We are currently utilizing both Zoho Desk and Zoho SalesIQ for our customer support operations. While both platforms offer WhatsApp integration, we are facing challenges due to the requirement of separate WhatsApp numbers

    • Provide a standard structure to your content using article templates

      Hello everyone, When multiple writers work on different documents, maintaining a standard structure can be challenging as each of the writer follows a different writing style. However, when the structure, tone, and format of every document is different,

    • Accessibility Spotlight Series - 1

      Every user interacts with products differently, what feels intuitive to one may be challenging for another. Addressing this, accessibility is built into Zoho Project's design philosophy. This helps users navigate and perform actions with ease irrespective

    • Projects Tasks Not Showing Dependencies

      I'm clicking on tasks and the popup to add dependencies isn't showing. I can't disconnect the nodes either. For some reason when I slide a task backwards it says it cannot go before a predecessor, even though there is not predecessor. Double clicking

    • Next Page