单击 Odoo 10 中的树视图字段时如何执行某些操作?

How to perform some action when clicking on the field of a tree view in Odoo 10?

我已经创建了自己的小部件,以这种方式在树视图中调用:

<field name="selected" widget="toggle_switch"/>

字段 selected 的类型为 boolean。我创建了扩展 Column class:

的小部件 class
var ListView = require('web.ListView');

var ToggleSwitch = ListView.Column.extend({
    template: 'ToggleSwitchSheet',
    events: {
        'click .slider': 'on_click',
    },

    init: function() {
        this._super.apply(this, arguments);
    },

    _format: function(row_data, options) {
        return QWeb.render(this.template, {
            'widget': this,
            'row_data': row_data,
            'prefix': session.prefix,
        });
    },
})

而且我是这样注册的:

var core = require('web.core');
core.list_widget_registry.add('field.toggle_switch', ToggleSwitch);

模板代码:

<t t-name="ToggleSwitchSheet">
    <label class="switch">
        <t t-if="row_data['selected']['value']">
            <input type="checkbox" checked="checked"/>
        </t>
        <t t-if="!row_data['selected']['value']">
            <input type="checkbox"/>
        </t>
        <span class="slider round"></span>
    </label>
</t>

它正在运行,但现在我想在每次用户单击我为小部件制作的模板的主要元素时修改 selected 字段的值。

问题是我做不到。 events 字典似乎不适用于 Column class,而且我不能使用像 this.on('click', this, this.on_click);this.$el.find(...) 这样的东西,因为 this 带来了只有 field 数据。

谁能帮帮我?我是否应该从其他 classes 继承以在我的小部件中使用事件(事实上我已经尝试过,但在每种情况下我的 Qweb 模板都从树视图中消失了...)?

我认为你在这里混了东西。或者可能不是。需要明确的是,列小部件仅用于显示信息。例如,让您的个性化 html 小部件适合列表视图。要执行操作,可以使用操作按钮在 python 方法中更改模型记录值。

我知道这并不完全相同,但我只是设置了基础,您可以通过使用列中的按钮使您的自定义小部件可点击,并且您的自定义小部件关联呈现选中值的结果按钮,允许您调用模型中的自定义方法来更改记录值。

据说您的小部件与 ColumnBoolean 小部件几乎相同,但如果您想继续完成工作,我认为您可以这样做:

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

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

    ListView.List.include({
        init: function (group, opts) {
            this._super.apply(this, arguments);
            this.$current.delegate('td label.switch', 'click', function (e) {
                e.stopPropagation();
                // execute your code here, like:
                var checked = $(e.currentTarget).find('input').prop('checked');

            });
        }
    });

});