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.

    • Recent Topics

    • Any way to "Pay with Check" or "Refund with Check" for Credit Notes?

      When we have a Bill in Zoho Books, we can select the "Pay with Check" option which then allows us to print/cut the check directly out of Zoho Books. When we created a Credit Note and want to refund the customer, is there any way to Refund with Check,
    • CRM Mobile reports

      When our engineers finish a job they like to email the customer a job report. This is best done todate as an email template but we can find no way to include an image field from that module. Is there any other options?
    • When Zoho Tables Beta will be open to EU data center

      Hello all, We in EU are looking at you all using and testing and are getting jealous :) When we will be able to get into the beta also? We don't mind testing and playing with beta software. Thank you!
    • Start Form on a different page (i.e., hide form pages)?

      I have a Zoho form that uses the `Field Alias - Prefill URL` feature. My goal is to have a pre-filled field that directs the user to a specific starting page in the form. For example: The URL will have a field alias that will auto-populate a field with
    • How can we disable "My Requests"?

      We are not using this functionality in our system at all and our users get confused.
    • PayPal payment received recording problem

      Hi, A little while back one of our customers used the PayPal payment option to pay an invoice For some reason though the payment is showing up twice within the Payments section of the invoice! Instead of setting the invoice value to ZERO, it now shows a negative value Anyone else face this problem? I've checked PayPal and there is only 1 payment in reality... A bug? Actonia ps: for anyone from Zoho Customer Service or tech team,  its Invoice 785 in our account
    • string(87) "{"code":"INVALID_TOKEN","details":{},"message":"invalid oauth token","status":"error"} " grtting this error

      Using access token i am trying to add sales orders through api but it is throwing errors like the above i have mentioned. Please help me for that
    • How to mute chat notification sound by default in Zoho SalesIQ?

      We’ve recently embedded the Zoho SalesIQ chatbot on our website, and we’ve noticed that notification sounds sometimes play even when the visitor hasn’t interacted with the chat widget yet. We’re trying to understand two things: Why do these sounds occur
    • Kanban View for Projects.

      At our organization, we describe active projects with various statuses like "In Proofing" or "Printing" or "Mailing". In the Projects view, one can set these project statuses by selecting from the appropriate drop-down. While this works, it's difficult to view and comprehend the progress of all of your projects relative to each other in a table. Creating a Kanban view for projects where I can move them from one status to another allows me to see where each project is in the order of our workflow.
    • How to Hide Article Links in SalesIQ Answer Bot Responses

      I have published an article in SalesIQ, and the Answer Bot is fetching the data and responding correctly. However, it is also displaying the article link, which I don’t want. How can I remove the link so that only the message is shown?
    • Add RECURRING option when adding email to calendar events

      When you add an email to a calendar event, there is no option to make that new calendar event into a recurring event.  It is counterproductive to make an event from your email to then have to go to your calendar, find the event, and make it recurring. 
    • Using Contains as a filter

      We are using Zoho Reports, ServiceDesk Plus analytics. I do not see how to create a report filter using Contains comparison of a string values, is one string contained in another. For example, Task Title contains the word Monitor. Is this possible in Zoho Reports?  This reporting feature is available in SDP reporting. Thanks in advance, Craig Rice
    • LINE Auto Message Connect to Zoho

      When I integrated LINE into the CRM, I was prompted to disable “Chat,” “Auto Response,” and “Greeting Messages,” and to enable the webhook. However, since I have already set up some auto-reply features in LINE, including Rich Messages and greeting automation,
    • Option to block bookings from specific email address or ip adresss in zoho booking

      Sometime few of our client keep booking irrelevant booking service just to resolve their queries and they keep booking it again and again whenever they have queries. Currently its disturbing our current communication process and hierarchy which we have
    • Threaded conversations for emails sent via automation

      Hi Guys, I hope you are doing well. Don't you guys think we should have an option in a workflow to notify users either as a new email or the previous email thread. For example, if you have one deal in the process and there are 10 different stages during
    • All new Address Field in Zoho CRM: maintain structured and accurate address inputs

      The address field will be available exclusively for IN DC users. We'll keep you updated on the DC-specific rollout soon. It's currently available for all new sign-ups and for existing Zoho CRM orgs which are in the Professional edition. Managing addresses
    • Create folder is fetch fails

      coming from zapier... zapier has a google drive task that searches for a specific folder in google drive, and if it fails to find the folder it will create a folder based on the search criteria, and contine along the singluar path of the flow. Trying
    • Meetups de Usuarios de Zoho - Noviembre 2025

      ¡Hola, Comunidad! Durante el mes de noviembre celebraremos los Meetups de usuarios de Zoho, encuentros presenciales pensados para quienes queráis mejorar vuestras estrategias de lead nurturing y aprender a sacar el máximo partido a herramientas como Zoho
    • Introducing 7 New Connectors in Zoho DataPrep!

      We’ve just made data management even easier - Zoho DataPrep now supports 7 new external connectors to help you build more robust, scalable ETL pipelines. Why it matters: ✅ Broader data access ✅ More automation, less manual work ✅ Smarter pipelines, better
    • Sales Order, Invoice and Payment numbers

      Hi zoho friends, it is me again, the slow learner. I'm wondering if there is a way to have it so the Sales order, invoice and payment numbers are all the same? It would be easier for me if they were the same number so there is not so many reference numbers
    • Missing information data Zoho inventory

      there some missing data in Zoho inventory connection. pick list stock counts bin location we have requested it via mail and the support team doesn’t gove feedback. has anyone achieve to get these info or to ask other ya les
    • First day of trying FSM in the field.

      What we found. 1. with out a network connection we were unable to start a service call? 2. if you go to an appointment and then want to add an asset it does not seem possible. 3. disappointed not to be able to actually take a payment from within the app
    • Zoho Desk app update: AI powered features

      Hello everyone! We’ve introduced various AI-powered services on the Zoho Desk app. Let's take a look at what's new. Generate Content: Generate Content uses AI to formulate responses based on the your query and provides a ready-to-use reply which can be
    • How to Automate Email Sequence

      I'm having trouble trying to set up a workflow to automate an email sequence. Once a group of emails in a Task has been tagged by a certain tag, I want an instant email template to be sent. After 7 days with no response, another email template would be
    • Turning off the new UI

      Tried the new 'enhanced' UI and actively dislike it. Anyone know how to revert back?
    • Zoho Sprints Android v2.0.4 app update: Item reminders, archive Epics, Kanban projects, Epic progress

      Hello everyone! In the latest version(v2.0.4) of the Zoho Sprints Android app update, we have introduced various new features. Let's take a look at what's new! Item Reminder Stay organized and never miss an important date with the all-new Item Reminder
    • Credit Management: #3 Setting Credit Limit for Customers

      Think about that one familiar customer of yours who always buys on credit. They usually pay on time, maybe a little late here and there, but not alarming. So, you are fine saying, "Sure, pay later." Then, one day, they place a significantly bigger order
    • Canvas View in Zoho Recruit

      Is it possible or would it be possible to have the new 'Canvas View' in Zoho Recruit?
    • Adding Reports to Portals

      Is there a way to add Reports to portals so only the user can see report templates relevant to them?
    • Update on the client portal URL for Guest users

      We’re updating the way Guest users access their Connect network. As part of this change, all client organization portals used by Guest users will now be accessible through a dedicated domain specific to each data center. The access URLs mentioned here
    • Preserve Ticket Issue Mapping When Migrating from Jira to Zoho Projects

      Hello Zoho Projects Team, We hope you are doing well. We are currently exploring a full migration from Jira to Zoho Projects, and we identified a critical limitation during the migration process involving Zoho Desk integration. Current Situation: We use
    • Enhancements to Zoho Maps integration tasks

      Hello everyone, We're excited to announce enhancements to the Zoho Maps integration tasks in Deluge, which will boost its performance. This post will walk you through the upcoming changes, explain why we're making them, and detail the steps you need to
    • Unable to see Zoho contacts in Zoho app on ios

      Hi Support Team, I am a new user, I have created my account and installed zohomail app on iOS 16 which works. I was also able to import my Gmail contacts into Zoho Contacts, which I can see. The problem is that I can’t see these imported cobalts in Zohomail
    • Task Due Date greater than 10 years.

      We use recurring tasks in Projects where every week, month, year etc Some of our projects are greater than 10 years and we are unable to set a new due date because the difference between start date and due date is greater than 10 years. As an example
    • External User onboarding for zoho connect is not really intuitive.

      So the external user is sent an invite, which has a button that directs them to login to zoho to view the invite, but if they don't have a zoho account, they cannot access that invite, which seems kinda silly, as there is not real way on for them to create
    • Enhance Sign CRM integration

      Hello all, I'm working on a custom Deluge script to enhance the integration between Zoho CRM and Sign by using a writer merge template for additional flexibility. I want to replicate the post-sign document integration that exists between CRM and Sign
    • Hosting external websites on Zoho?

      How can I host my external website on zoho? Do we have that option? I am currently with hostinger and am looking to switch to zoho. Kindly help. Thanks.
    • How to Add Time Formula Duration (hh:mm)

      Hi everyone — I’m trying to create a formula field in Zoho CRM that calculates the difference between a “Call Start Time” and “Call End Time” and displays the duration in HH:MM format (for example: 1:04 for one hour and four minutes). My current setup
    • How can I calculate the physical stock available for sale?

      Hey Zoho Team,  I've tried to calculate the physical stock on hand in various ways - but always receive a mismatch between what's displayed in Zoho Inventory & analytics.  Can you please let me know how the physical stock available for sale is calculated?
    • Set Custom Icon for Custom Modules in new Zoho CRM UI

    • Next Page