Tip 4: How to dynamically display images in a live form.

Tip 4: How to dynamically display images in a live form.




Hi everyone,

We hope our previous tip was useful to many of you here. We are back with a new tip that would help enhance the user experience of your app.

Yes, that's right. Today, we will look at how to display an image in a live form that is already uploaded using another Zoho Creator form. That is, we will auto-populate the image within the Add Notes field based on input in another field. The logic behind this is pretty simple — just store, fetch, and display.

To get a better understanding, let's consider a sample application that has two forms Add Products and New Orders. 

 




The Add Products form will contain two fields, a Single line field to store the product's name and an Image type field to store the image of the product. You may submit a couple of sample values and images using the Add Products form.

In the New Orders  form, we'll have two fields —an Add Notes field and also a Lookup field(Products) which will display product names fetched from the Add Product form.

Our objective here is, once a Product name is selected using the Lookup field, we need to fetch the corresponding image from the Add Products form and auto-populate it within the notes field.

The application structure can be broken down as given below: (The Deluge name of respective forms and its fields are mentioned within the brackets).



Now, let's see how to dynamically display images in the New Order form. 

For that, we need to add the below given code snippet to the On User Input workflow of the Lookup field(Product) in the New Orders form. First, let's fetch the image data based on the Product selected in the Lookup field.
  1. img = Products[ID == input.Product].Product_Image;
Next, let's do a quick a Null check to prevent the script from executing unnecessarily when the Lookup field is cleared.

  1. if(img != null)
  2. {
  3. //Replacing the masked parameters with valid application specific parameters
  4. img = img.replaceAll("/sharedBy/appLinkName/",zoho.appuri);
  5. img = img.replaceAll("viewLinkName","All_Products");
  6. img = img.replaceAll("fieldName","Product_Image");
  7. img = img.replaceAll("<img ","<img height=200px width=200px ");
  8. input.plain = img;

Here, All_Products is the Deluge link name of the list report of the Add Products form.

Now, let's add sample data to the app and see what happens when a particular product is chosen from the Lookup field (Product) in the New Order form. A corresponding image will be automatically displayed as shown in the below given screenshot.

​

Note: The replaceAll function replaces all the occurrence of the string that matches the given <searchString> expression with the given <replacementString>. Click here to learn more.

Hope you got a fair idea on how to dynamically display images in a live form. Keep watching this space for more such tips.






    Access your files securely from anywhere

          Zoho Developer Community

              Bootcamp
              Community
              Pricing
              Webinars
              What's New
              Integrations
              Contact Support
              Contact Sales

                Zoho Survey Resources
                  Features
                  Survey Templates
                  Integrations
                  Community
                  iOS Mobile Surveys
                  Pricing
                  Android Mobile Surveys
                  Insurvey Blogs
                  Insight Blogs
                  Tips & Tricks





                                Latest Feature Updates


                                    Zoho Desk Resources

                                    • Desk Community Learning Series


                                    • Digest


                                    • Functions


                                    • Meetups


                                    • Kbase


                                    • Resources


                                    • Glossary


                                    • Desk Marketplace


                                    • MVP Corner


                                    • Word of the Day




                                        Zoho Marketing Automation
                                          Zoho SalesIQ Resources


                                                Manage your brands on social media
                                                Access Zoho Social

                                                  Zoho Pagesense Resources


                                                      Zoho TeamInbox Resources

                                                        Zoho DataPrep Resources



                                                          Zoho CRM Plus Resources

                                                            Zoho Books Resources


                                                              Zoho Subscriptions Resources

                                                                Zoho Projects Resources


                                                                  Zoho Sprints Resources


                                                                    Qntrl Resources


                                                                      Zoho Creator Resources



                                                                          Zoho Campaigns Resources


                                                                            Zoho CRM Resources

                                                                            • CRM Community Learning Series

                                                                              CRM Community Learning Series


                                                                            • Kaizen

                                                                              Kaizen

                                                                            • Functions

                                                                              Functions

                                                                            • Meetups

                                                                              Meetups

                                                                            • Kbase

                                                                              Kbase

                                                                            • Resources

                                                                              Resources

                                                                            • Digest

                                                                              Digest

                                                                            • CRM Marketplace

                                                                              CRM Marketplace

                                                                            • MVP Corner

                                                                              MVP Corner





                                                                                Design. Discuss. Deliver.

                                                                                Create visually engaging stories with Zoho Show.

                                                                                Get Started Now


                                                                                  Zoho Show Resources


                                                                                    Zoho Writer Writer

                                                                                    Get Started. Write Away!

                                                                                    Writer is a powerful online word processor, designed for collaborative work.

                                                                                      Zoho CRM コンテンツ






                                                                                        Nederlandse Hulpbronnen


                                                                                            ご検討中の方





                                                                                                  • Recent Topics

                                                                                                  • Auto-Create OneDrive Folder Structure Upon Lead Creation

                                                                                                    Hello, New to Zoho and looking for help on a critical process automation I'm looking to implement. My company currently utilizes OneDrive for file management and the folder structure is Proposals -> Client Name -> Address (where I need to initially create

                                                                                                  • Show iFrame of related List inside of Blueprint Transition

                                                                                                    Hey, is it possible to show an iFrame of a related list like this inside of a Blueprint transition?

                                                                                                  • Can't delete bank transactions (i changed from 14 days trail to free just now)

                                                                                                    Hi, I manually added one bank transaction When i try to delete it, it say below: What should I do?

                                                                                                  • Lookup Fields not Converting

                                                                                                    I manage holiday properties. I have a lookup to the Accounts (Properties) in the Leads module. The lookup is connected to the property address field. When I convert it the lookup field does not update in Deals, although the property address does. There

                                                                                                  • Leave Policy for Brazil

                                                                                                    Hi, Brazil asked us to configure Zoho People to apply the following policy: · To block starting vacations 2 business days before holidays or weekends; Employees cannot start their vacations 2 days before holidays or weekends. Example: If December 25th

                                                                                                  • 2024: A Year of Transformation with Zoho Forms

                                                                                                    As we close the curtain on another exciting year, it’s time to reflect on the strides Zoho Forms has taken in 2024. From empowering businesses with advanced tools to simplifying workflows and enhancing user experiences, our updates this year were all

                                                                                                  • Stop selling out of stock Items.

                                                                                                    Hi I have been using Zohobooks for a around 8 month now. I am not involved in selling process but my staff cant stop selling product which they do not hold in stock, this is a big headache for me as physical count never matches what is shown on the books. 

                                                                                                  • Email tracking subdomain

                                                                                                    The Email Tracking configuration screen of the ZeptoMail asks for a subdomain. I have gone through the documentation but could not find more information about how that subdomain is used by ZeptoMail to track the emails. Can someone throw some light about

                                                                                                  • Bigin API Token Request ("invalid_client")

                                                                                                    Hi people, I tried to connect to the API without success, I've read all of the documentation multiple time and tried just about everything. I tried to do it with Python Request module and with Postman, passing the information through both the URL parameter

                                                                                                  • Customer Happiness not clickable when using API

                                                                                                    Is there a way to automatically add the Customer Feedback links when generating email drafts via the API? Currently, the feedback links are only added when generating an email draft using the UI. I tried using the endpoint described in https://desk.zoho.com/DeskAPIDocument#CustomerFeedback#CustomerFeedback_Getthecustomerfeedbackplaceholderlink

                                                                                                  • Error 403: Forbidden When Updating Email Signature via API

                                                                                                    Hi Zoho Desk team, First, congratulations again on the excellent Zoho API. But, I’m encountering an issue while attempting to update an email signature via the API. Whenever I make a request to update the signature, the response returns an HTTP 403 Forbidden

                                                                                                  • Send To Zoho Sign not Showing

                                                                                                    The button send to Zoho sign is not showing on my Zoho CRM . Is there additional steps I need to take after installing Zoho Sign to CRM ?

                                                                                                  • How to Get An Image's URL once it's uploaded to library?

                                                                                                    I manage to find URLs to the images I uploaded to my library, but after a day, it seems the links stop working like its only temporary. Where can I find the ACTUAL solid URL for my images that I upload to my Library so I can use them for my custom template / HTML coded template? Thanks, Mac

                                                                                                  • 【Zoho CRM】インポート機能のアップデート：既存データへのタグ追加が可能に！

                                                                                                    ユーザーの皆さま、こんにちは。コミュニティチームの藤澤です。 今回は「Zoho CRM アップデート情報」の中のインポート機能のアップデートをご紹介します。 Zoho CRMのタグは、データを効率的に分類、認識するためのラベルです。 タグ付けは次の3つの方法で行えます： 個別タグ付け：少数のデータを手動でタグ付け 自動化：特定のタイミングで繰り返しタグ付け 一括更新：インポート機能でタグを追加または更新 今回のアップデートでは、インポート時に既存のタグを残したまま、新しいタグの追加、既存タグを置き換えできるようになりました。

                                                                                                  • Link to Desk tickets

                                                                                                    Hello, We are using Analytics to analyze data in Desk. Is there a way to embed a link to a ticket in reports?  We'd love to be able to see the drill down data, and click a value in a result row that would launch the Desk Ticket in another window/tab. Thanks in advance for any ideas!

                                                                                                  • Bluerprints: How to connect the created record back?

                                                                                                    I've a blueprint which creates another record as part of an 'After' transition. But the two records don't seem to be linked together. If it's not automatic - how do I get the created record ID to link it to the original record? Thanks!

                                                                                                  • Zoho Desk -> Zoho Analytics : Where is the field for "Layout" ?

                                                                                                    I have many different layouts on my helpdesks and I want to be able to identify the stats for each one, however I can not file the field in the raw data from the Zoho Desk datasource. I thought it might be under "Tickets" but there is nothing. There is

                                                                                                  • Populate a Related List Item based on a Stage

                                                                                                    I would like to know if I can populate a CLOSED DEAL section in a contact that populates only when a Deal (something in the Deal Module) is listed as Closed - Won. I'd like another section that is just called deals, which shows me all other deals that

                                                                                                  • Being able to draw inside a module ?

                                                                                                    I was wondering if anyone know of a solution for this request. We would like to be able to draw directly from one module in the CRM and have it attached to that record. Here is an example. Paul would go to the customer once he as done the measuring, he

                                                                                                  • Introducing Zia LLM: Zoho’s in-house Generative AI solution for CRM's AI capabilities

                                                                                                    Hello everyone, We're excited to announce the launch of our in-house Large Language Model (LLM) by Zia to power our AI offerings. What is LLM? LLM stands for Large Language Model, a powerful AI technology that processes and generates human-like text based

                                                                                                  • Blueprint: multi-select lookup field not available in the criteria option

                                                                                                    I read this old forum post which stated that multi-select lookup fields are now selectable as an option in a Blueprint transition configuration: https://help.zoho.com/portal/en/community/topic/blueprint-multi-select-lookup-field-not-available-within-blueprint-transition

                                                                                                  • 2 serial numbers for 1 item (Mac address and Serial number)

                                                                                                    There is a way to track 2 serial number type for 1 Item. Ex: Some electronic devices have a MAC address and a serial number. I need to track those 2 numbers

                                                                                                  • Holidays

                                                                                                    Hi; For defining Holidays, you need to add logic to handle the year as well as the month & day. We need to be able to enter Holidays for the next year. I need to add a holiday for January 2, 2017, but I can't until January 1st, which is a Sunday and we

                                                                                                  • Workflow for "Expenses" module?

                                                                                                    Hi there, over the last 2 years, Zoho Expense has seen tremendous growth and we are happy with it. But, sometimes it is frustrating to see things are being implemented halfheartedly, or so it seems. For example, There is the possibility to create workflows

                                                                                                  • BUG ALERT: Client Script + Commands -> $Page contextual data is not updated

                                                                                                    When using the new Client Script Commands feature, there is an issue with the Client Script $Page contextual data not accurately being updated each time a Command is run. Assuming a Client Script Command called "Client Script Command Bug" with the following

                                                                                                  • Client Script: $Client.refresh({ triggerOnLoad: true }); not triggering onLoad Client Scripts

                                                                                                    Hey friends! I'm trying to store a temporary var, refresh the page for the user, then check that temporary var and do some actions. Theoretically using the title's code: $Client.refresh({ triggerOnLoad: true }); should refresh the page and trigger on

                                                                                                  • Query table pull last 12 months

                                                                                                    I am tying to pull the following criteria and the date is always what causes me the issue. I want to pull people (pco_id) who have entries of "event_id" being these 2 events and whos "kind" is Regular or Guest and where the event_starts_at (date column)

                                                                                                  • Delete a department or category

                                                                                                    How do I delete a Department?  Also, how do I delete a Category? This is pretty basic stuff here and it's impossible to find.

                                                                                                  • Calculate months and years between 2 dates on subform

                                                                                                    I am looking for a function syntax for an employment candidate to calculate the number of years and months (decimal format. eg 1.2 years) they are employed. I have their start date entered, but if the end date is blank, that tells me they are still employed

                                                                                                  • Adding Bluesky channel

                                                                                                    Hello, Is Bluesky (AT protocol) soon added on Social ? Bluesky is being developped and is now open to anyone (no more invitation) Thank you

                                                                                                  • Remove or hide default views

                                                                                                    I'm looking to only have the views pertinent to my organization.  Is there a way to show only my custom views (or separate them to a different area or something)? If not, this should be a feature as switching from Zendesk we had this option...

                                                                                                  • User can choose the PDF report

                                                                                                    Hi. I would like to find out if a user (Creator or customer portal) to choose from the different PDF customised reports that have been built?

                                                                                                  • Analytics Module: Can you move items from one dashboard to another?

                                                                                                    Is there a way to move items from one dashboard to another? I want to rearrange my dashboard now that I know what i'm doing but i don't want to remake my various widgets? Edit: Hey Zoho, This would be a good feature: to be able to move/copy widgets to

                                                                                                  • Copy Widget to another Dashboard

                                                                                                    I can see the option to clone a widget to the same dashboard but is it possible to copy it to another dashboard?

                                                                                                  • Is there a way to print the dashboard?

                                                                                                    I would like the capability of printing the dashboard - is that possible?

                                                                                                  • Custom Deal Name in Lead Conversion Mapping

                                                                                                    I know there are ways to change the name of a Deal after conversion using a custom function, so no need to repost that information. I would like to see the CRM Improved with Deal Name Customisation and I think the Lead Conversion Mapping page would be

                                                                                                  • Build custom AI solutions with Catalyst’s QuickML capabilities in CRM

                                                                                                    Hello everyone, We’re thrilled to announce an improvement for our Zoho CRM Enterprise users: the ability to create custom AI solutions using Catalyst’s QuickML directly from Zoho CRM. As you may already know, Zia, Zoho CRM’s AI-powered assistant, offers

                                                                                                  • Recommendations to store meeting notes for easy access from Contacts, Accounts & Deals module records?

                                                                                                    I would like your advice on how to achieve this use case for my organization. It’s related to where/how best to store meeting notes from a conversation with Contact(s) working at an Account (Company) in the context of a Deal. The ideal solution (from

                                                                                                  • Introducing Record Summary: smarter insights at your fingertips

                                                                                                    Hello everyone, Building on the recent launch of Zoho's in-house Zia Large Language Model (Zia LLM)—a major milestone in Zoho CRM’s AI capabilities—we’re excited to introduce the Record Summary feature. This powerful addition makes use of Zia LLM to simplify

                                                                                                  • Suppress "spreadsheet will not be saved" message on published sheet

                                                                                                    I have published a sheet and have one column on that sheet that the user can edit (a dropdown picklist where the user can select the status for each line). Is there a way to suppress the Zoho Sheet message "Any changes made to this published spreadsheet

                                                                                                  • Next Page