Previous:
Custom Pages in Vivaldi
Drilling from a Table to Another Form
You can define a drill behavior where users can click a cell
in your tabular forms and navigate to another form you specify
(table or detail) and immediately filter to a related value.
For example, you may want users to be able to click on a
customer name in your Orders table to then view the customer
detail, or a list of the customer's contacts or orders.
- Click on the Wizard next to the Click Event property in
the Form Item detail screen.
- Speciify the source field in your table that contains
the value you want to drill by. Important:
Make sure your field is an item defined for your tabular
form, even it is hidden. For example, you might have
an identifier field you don't need users to see, but if it
contains the drillable value (e.g., customer ID), make sure
to add it and hide it on the tabular form.
- Specify the form you want users to be taken to.
- Specify the corresponding target field on the target
form that will be used to filter values based on the source
field from step (2).
- Choose whether you want to send the user to the
full-page form, or just show it in a popup window.
- Click Apply to close.
- If you want the values in the table to have an underline
indicator that the user can see the value is clickable,
enter 'tablelink' into the CSS Classes property.
Controlling Button Click Events
You can add buttons to your Detail Forms by adding a new
item and selecting "Button" for the display type.
- In the Click Event add the name of the event you want to
call, such as MyClick()
- In your /js/customer.js file, add a new event MyClick()
and define the behaviour you want to call.
- To access other controls on the form, it is often
easiest to assign those controls a CSS Class to reference,
as each control on the form has a unique name that will be
different each time the form opens (to prevent multiple
instances of the same form being open causing issues).
Other Events (Dropdown changes, etc.)
Custom events can applied to the application as a whole,
or individual controls. To apply an event to an
individual control, use the "Click Event" setting for any
form item to call a custom javascript event that you define
in the customer.js file. The customer.js file is in
the /js/ directory of your Vivaldi deployment. To
apply a general event using javascript or jquery universally
to Vivaldi, you can use the customer.js file as well.
It will not be overwritten during an upgrade.
Alternatively, you can also bind events to a CSS Class you
assign to a control. Examples are provided in the
customer.js file.
Using jQuery Events
jQuery is fully supported, and we recommend you use
noConflict() in most cases to ensure any pages or script you
create will function correctly. For example, if you
need to call your own custom jQuery events, you can use the
following:
var j = jQuery.noConflict();
$j("yourreference")...
This will ensure there are no collisions with jQuery between forms. If you encounter difficulty, you can try to use $ogidx as the jQuery reference, which is established in the global index file.
Custom Styles
Custom styling can applied to the application as a whole, or
individual controls. To apply a style to an individual
control, use the "CSS Classes" setting for any form item.
To apply style overrides universally to Vivaldi, you can
modify the customer.css file that is in the /styles/
directory of your Vivaldi deployment. It will not be
overwritten during an upgrade.