Web Development | Ios and Android App Development Company in Charlotte Nc
+1 704 215 4622
[email protected]

Tree View Button: Avoiding the Blank Space in the Tree Header for Corresponding Button in Odoo

In a normal case, we can create a view by using the corresponding fields in the database table (Odoo model) i.e., the header value of the tree view will be the string value of these fields. But it will be entirely different in case of a button.

In model view, the button will be an instance but not a field (not a column) in the database table. Because of this, in the tree header there will be a blank space for the corresponding button.

Getting started

STEP 1:  ADD  /static/src/xml/{FILENAME}.xml

odoo.define(ModuleName.EditableListRenderer', function (require) {
"use strict";

var ListRenderer = require('web.ListRenderer');

ListRenderer.include({
  _renderHeaderCell: function (node) {
        const $th = this._super.apply(this, arguments);
        if (node.attrs.class === 'custom_identifier'){
            $th.text(node.attrs.string);
        }
        return $th;
    },
});
});

STEP 2: Add custom class for identifying the button, the given string value is used to render the table header.

<button name="{{ ACTIONNAME }}"
type="{{ ACTIONTYPE }}" 
icon="fa-truck" 
string="Procurement"
        class="custom_identifier"/>

STEP 3: Add the JS files in Odoo assets.

<template id="assets_frontend" inherit_id="web.assets_backend" name="table style">
    <xpath expr="." position="inside">
         <script type="text/javascript"
src="/ModuleName/static/src/js/{{ FILENAME }}.js"></script>
     </xpath>
 </template>

STEP 4:  __manifest__.py

‘data: [
“views/assets.xml”,
]
STEP 5:  Server Restart

if you like us to help you with your next odoo implementation project please contact us

About author View all posts

Aswanth Babu

Leave a Reply

Your email address will not be published. Required fields are marked *