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! Also check out our Odoo pricing page to know how much will it cost for a successful Odoo Implementation for your business.
