How to configure Client Action in Odoo 19

In Odoo, a client action represents an operation executed on the client side of the application. Since Odoo works on a client-server model, client actions are typically defined using XML for configuration and JavaScript (OWL in Odoo 19) for the front-end logic. These actions allow us to link menu items to custom widgets or dynamic views, giving users more interactive functionality inside the Odoo interface.

In Odoo 19, the OWL framework is the standard for building and rendering client-side components. OWL provides reactive hooks, component lifecycle handling, and a modular structure, which makes it ideal for extending Odoo’s web client.

Add a menu to the views/client_action_views.xml file in the directory of the view.

Filename: client_action_views.xml

<?xml version="1.0" encoding="UTF-8"?>

<odoo>
   <data>
       <!-- Client Action -->
       <record id="action_event_dashboard" model="ir.actions.client">
           <field name="name">Dashboards</field>
           <field name="tag">event_dashboard.dashboard</field>
       </record>
       <!-- Menu Item -->
       <menuitem id="menu_event_dashboard"
               name="Dashboards"
               parent="base.menu_custom"  <!-- adjust parent menu -->
               sequence="1"
               action="action_event_dashboard"/>
       </data>
</odoo>

The parent attribute in a menu item determines under which existing menu the new action will appear, and it should be set to the correct menu ID for the related model

Js File: client_action.js

When defining a Dashboard action in the ir.actions.client model, a custom tag such as advanced_dashboard is assigned. This tag serves as the link between the action and the widget, ensuring that the corresponding JavaScript component is triggered when the menu item is clicked.

To build the Dashboard itself, we extend the Component class and provide a template that will be rendered during this action

/** @odoo-module **/
import { registry } from "@web/core/registry";
import { Component } from "@odoo/owl";
export class AdvancedDashboard extends Component {
   setup() {
       super.setup?.();
       // You can add your state, hooks, or services here
   }
}
// Link to your QWeb template
AdvancedDashboard.template = "event_dashboard.advanced_dashboard";
// Register as a client action
registry.category("actions").add("event_dashboard.dashboard", AdvancedDashboard);

Keywords in Client Actions

• tag:

A unique identifier used to link a client action to its corresponding JavaScript component. This ensures the system knows which action to execute when the tag is triggered.

• params (optional):

Additional parameters can be passed along with a client action. They are usually structured as key–value pairs (similar to dictionaries in Python), making it easy to organize and transfer data to the client side.

• target (optional):
  

Defines where and how the client action should be displayed:

1. main (default) – Renders inside the main content area of the application. Using main instead of current also clears previous breadcrumbs, making it useful for root-level navigation.
2. fullscreen – Expands the client action to occupy the entire screen.
3. new – Opens the client action in a separate dialog or popup window.

The template should be defined first (in static/src/xml).

Filename: client_action.xml

<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
   <t t-name="event_dashboard.advanced_dashboard">
       <div>
           <h1>Dashboard Rendered through client action</h1>
       </div>
   </t>
</templates>

In Odoo 19, you declare your custom JavaScript and XML assets directly in the assets section of the module’s __manifest__.py. This ensures they are loaded into the backend when the module is installed.

'data': [
       'views/client_action_views.xml'
   ],'assets': {
       'web.assets_backend': [
           'event_dashboard/static/src/js/client_action.js',
           'event_dashboard/static/src/xml/client_action.xml',
       ],
},

Client actions in Odoo 19 offer a whole new level of flexibility for developers. Instead of being limited to standard views, you can build fully interactive dashboards, custom widgets, and dynamic pages right inside the Odoo backend. By combining XML, JavaScript (OWL components), and the power of the registry, you can design user-friendly interfaces that match your business needs.

To read more about How to Create and Use Client Actions in Odoo 19, refer to our blog How to Create and Use Client Actions in Odoo 19.