You can define an action that takes place when an image in a panel is clicked. You can link various actions to a click of an image including redirecting users to an external URL, opening a Zoho Creator component like a form, report, or a page. You can also specify a custom function to be triggered on click of the image.
To configure the action to be associated with a panel's image
-
Click to select a panel that holds the image you want to configure an action for.
-
Click the
Configure
option in the toolbar in the header area of the page builder. A configuration sheet slides in.
-
Click to select the image inside the panel.
-
From the configuration options on the right, select
Action
.
-
Choose from the options:
-
None
: Use this option to remove any action associated previously.
-
Open URL
: Opens a given URL in a specified target window.
-
Open form
: Opens a specified form. You can select a form from any application in your account.
-
Open report
: Opens a specified report. You can select a report from any application in your account.
-
To configure Open report action:
-
Open page
: Opens a specified page. You can select a page from any application in your account.
-
Execute function
: Invokes a custom function, specified in any application of your Zoho Creator account.
Confirmation for function execution in panel images
Before executing actions such as deleting certain records, a confirmation for proceeding with it helps ensure you don't delete important records by accident. Sometimes, inexperienced users may never even realize that a record was deleted or that more than one record was accidentally deleted. In such instances, it is always safe to confirm the action request before execution.
Here are some of the scenarios where actions can have confirmation before they're executed:
-
Deleting
-
Approving or Rejecting
-
Changing Status
-
Send emails
Note
: In pages, this confirmation for actions is available only for executing a function.
Configure confirmation for function execution
-
Edit your application
-
Open your
page builder
and select the panel that contains the
image
you want to configure an action for.
-
Click the
Configure
option in the toolbar in the header area of the page builder. A
configuration
pane will slide in.
-
On the left side of the
configuration
pane, a preview of the panel will appear.
-
Click to select the
image
inside the panel.
-
Click the
Action
tab and choose
Execute function
from the
Action Type
dropdown on the right.
-
Select a
custom function
and specify the argument value.
-
Click
After confirmation
under the
Execute the workflow
section.
-
Specify the following:
-
Confirmation message
: The message that will be displayed in the confirmation popup informing users of the action that will take place when they confirm to execute it.
-
Confirmation execution button
: The button text that will be displayed to confirm the function execution.
-
Cancel execution button
: The button text that will be displayed to cancel the function execution.
Note
: The default values for the
Confirmation execution
button and
Cancel execution
button will be
Yes
and
No
respectively.
-
The changes will be saved automatically. When you access your page in live mode, the confirmation popup will prompt users before the function is executed.
ZML script for confirmation of function execution
The below script shows how to configure the confirmation popup details such as confirmation message, confirmation execution button and cancel execution button for the execute function action in the panel's image element:
<panel>
<pr height='auto' width='auto'>
<pc>
<pr>
<pc>
<image action='ExecuteFunction' executeWorkflow='afterConfirmation' confirmationMsg='Are you sure you want to cancel the order?' confirmButtonText='Cancel' cancelButtonText='Back'
parameters='string' functionName='cancelOrder' color='#FFFFFF' bgColor='#0ABB51' width='52px' height='52px' type='icon' value='media-1-ticket-76' size='32px' cornerRadius='26px' iconType='solid' />
</pc>
</pr>
</pc>
</pr>
</panel>