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

Question

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

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

selected 字段的类型为 boolean。我创建了扩展 Column 类的小部件类：

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 类，我不能使用this.on('click', this, this.on_click); 或this.$el.find(...) 之类的东西，因为this 只带来field 数据。

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

Answer 1

我认为你在这里混入了一些东西。或者可能不是。需要明确的是，列小部件仅用于显示信息。例如，让您的个性化 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');

            });
        }
    });

});