I'm currently creating a custom Odoo13 module where I want to display a wizard to the user with a table of values, so they can select one or many rows and after clicking a button, perform an action only on the selected rows.

So far, I was able to create the wizard view and display the many2many field as a table, see image below:

My question is: How can I show a column with checkboxes so the user can select the rows they are interested in?

I have seen this in a lot of places in odoo base modules, like the following image:

I tried defining the wizard view like this:

<?xml version="1.0" encoding="UTF-8"?>
<odoo>
   <data>
        <record id="product_list_dilve_wizard_view" model="ir.ui.view">
            <field name="name">Import product from DILVE</field>
            <field name="model">dilve.import.product.list.wizard</field>
            <field name="arch" type="xml">
                <field name="dilve_records" widget="many2many">
                    <tree editable="top" create="false" edit="true"
                          decoration-success="type == 'new'"
                          decoration-warning="type == 'changed'">
                        <field name="isbn" />
                        <field name="name" />
                        <field name="type" invisible="True" />
                    </tree>
                </field>
                <footer>
                    <button string="Importar" name="create_product" class="oe_highlight" type="object"/>
                    <button name="cancel" string="Cancelar" class="oe_link" special="cancel"/>
                </footer>
            </field>
        </record>

       <record id="product_template_inherited_tree_view" model="ir.ui.view">
           <field name="name">product.template.view.tree.inherit</field>
           <field name="model">product.template</field>
           <field name="inherit_id" ref="product.product_template_tree_view"/>
           <field name="arch" type="xml">
               <xpath expr="//tree" position="attributes">
                   <attribute name="js_class">button_in_tree</attribute>
               </xpath>
           </field>
       </record>
   </data>
</odoo>

Tried with multiple widget options and changing the editable, create, edit properties, but none of that worked.

The javascript function for creating the view is this (I had to do it like this and not xml because I wanted to add the button that triggers the wizard near the "create" odoo button):

_OpenWizard: function () {
       var self = this;
        this.do_action({
           type: 'ir.actions.act_window',
           res_model: 'dilve.import.product.list.wizard',
           name :'Import data from DILVE',
           view_mode: 'tree',
           view_type: 'form',
           view_id: 'product_list_dilve_wizard_view',
           views: [[false, 'form']],
           target: 'new',
           res_id: false,
       });
   }

Bonus points: I would also like to know how can I group rows based on the type field. So instead of showing green or yellow, a dropdown row is displayed.

Thanks!

I'm currently creating a custom Odoo13 module where I want to display a wizard to the user with a table of values, so they can select one or many rows and after clicking a button, perform an action only on the selected rows.

So far, I was able to create the wizard view and display the many2many field as a table, see image below:

My question is: How can I show a column with checkboxes so the user can select the rows they are interested in?

I have seen this in a lot of places in odoo base modules, like the following image:

I tried defining the wizard view like this:

<?xml version="1.0" encoding="UTF-8"?>
<odoo>
   <data>
        <record id="product_list_dilve_wizard_view" model="ir.ui.view">
            <field name="name">Import product from DILVE</field>
            <field name="model">dilve.import.product.list.wizard</field>
            <field name="arch" type="xml">
                <field name="dilve_records" widget="many2many">
                    <tree editable="top" create="false" edit="true"
                          decoration-success="type == 'new'"
                          decoration-warning="type == 'changed'">
                        <field name="isbn" />
                        <field name="name" />
                        <field name="type" invisible="True" />
                    </tree>
                </field>
                <footer>
                    <button string="Importar" name="create_product" class="oe_highlight" type="object"/>
                    <button name="cancel" string="Cancelar" class="oe_link" special="cancel"/>
                </footer>
            </field>
        </record>

       <record id="product_template_inherited_tree_view" model="ir.ui.view">
           <field name="name">product.template.view.tree.inherit</field>
           <field name="model">product.template</field>
           <field name="inherit_id" ref="product.product_template_tree_view"/>
           <field name="arch" type="xml">
               <xpath expr="//tree" position="attributes">
                   <attribute name="js_class">button_in_tree</attribute>
               </xpath>
           </field>
       </record>
   </data>
</odoo>

Tried with multiple widget options and changing the editable, create, edit properties, but none of that worked.

The javascript function for creating the view is this (I had to do it like this and not xml because I wanted to add the button that triggers the wizard near the "create" odoo button):

_OpenWizard: function () {
       var self = this;
        this.do_action({
           type: 'ir.actions.act_window',
           res_model: 'dilve.import.product.list.wizard',
           name :'Import data from DILVE',
           view_mode: 'tree',
           view_type: 'form',
           view_id: 'product_list_dilve_wizard_view',
           views: [[false, 'form']],
           target: 'new',
           res_id: false,
       });
   }

Bonus points: I would also like to know how can I group rows based on the type field. So instead of showing green or yellow, a dropdown row is displayed.

Thanks!

• python
• xml
• forms
• tree
• odoo

Share Improve this question Follow asked Mar 16 at 13:34 Alberto MAlberto M 5311 silver badge33 bronze badges 3

• as far as i know, we can only achieve that using one2many field, not sure about many2many – farisfath25 Commented Mar 17 at 9:22
• however, i just searched that, there exists 'many2many_checkboxes' widget (ludwiktrammer.github.io/odoo/…) – farisfath25 Commented Mar 17 at 9:27
• 1 You can extend the FieldX2Many widget and add the hasSelectors attribute to the render params – Kenly Commented Mar 19 at 10:52

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 0

_OpenWizard: function () {
       var self = this;
        this.do_action({
           type: 'ir.actions.act_window',
           res_model: 'dilve.import.product.list.wizard',
           name :'Import data from DILVE',
           view_mode: 'tree',
           view_type: 'form',
           view_id: 'product_list_dilve_wizard_view',
           views: [[false, 'form']],
           target: 'new',
           res_id: false,
       });
   }

In Odoo v13, You can customize the existing many2many_widget this way by overriding its _Render function (add the hasSelectors in therenderparams).

iI you want this customization only for your special case, you should create your own widget using FieldMany2ManyTags.extend (+add its name to the registry) instead of FieldMany2ManyTags.include)

In the file yourcustommodule/__manifest__.py:

'assets': {
'web.assets_backend': [
'/yourcustommodule/static/src/js/relational_fields.js',
],
},

In the file yourcustommodule/static/src/js/relational_fields.js:

odoo.define('yourcustommodule.relational_fields', function (require) {
"use strict";


var relational_fields = require('web.relational_fields');
var FieldMany2ManyTags = relational_fields.FieldMany2ManyTags;
//var field_registry = require('web.field_registry');

FieldMany2ManyTags.include({
   
    init: function () {
        this._super.apply(this, arguments);
        this.hasSelectors = true;
    },

/* complete override: */

_render: function () {
        var self = this;
        if (!this.view) {
            return this._super();
        }
        if (this.renderer) {
            this.currentColInvisibleFields = this._evalColumnInvisibleFields();
            return this.renderer.updateState(this.value, {
                columnInvisibleFields: this.currentColInvisibleFields,
                keepWidths: true,
            }).then(function () {
                self.pager.updateState({ size: self.value.count });
            });
        }
        var arch = this.view.arch;
        var viewType;
        var rendererParams = {
            arch: arch,
        };

        if (arch.tag === 'tree') {
            viewType = 'list';
            this.currentColInvisibleFields = this._evalColumnInvisibleFields();
            _.extend(rendererParams, {
                editable: this.mode === 'edit' && arch.attrs.editable,
                addCreateLine: !this.isReadonly && this.activeActions.create,
                addTrashIcon: !this.isReadonly && this.activeActions.delete,
                isMany2Many: this.isMany2Many,
                columnInvisibleFields: this.currentColInvisibleFields,
hasSelectors: this.hasSelectors,
            });
        }

        if (arch.tag === 'kanban') {
            viewType = 'kanban';
            var record_options = {
                editable: false,
                deletable: false,
                read_only_mode: this.isReadonly,
            };
            _.extend(rendererParams, {
                record_options: record_options,
                readOnlyMode: this.isReadonly,
            });
        }

        _.extend(rendererParams, {
            viewType: viewType,
        });
        var Renderer = this._getRenderer();
        this.renderer = new Renderer(this, this.value, rendererParams);

        this.$el.addClass('o_field_x2many o_field_x2many_' + viewType);
        if (this.renderer) {
            return this.renderer.appendTo(document.createDocumentFragment()).then(function () {
                dom.append(self.$el, self.renderer.$el, {
                    in_DOM: self.isInDOM,
                    callbacks: [{widget: self.renderer}],
                });
            });
        } else {
            return this._super();
        }
    },
});
});