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

时间:2018-10-19 09:42:37

标签: javascript xml odoo odoo-10 qweb

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

<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仅带来{{ 1}}数据。

有人可以帮助我吗?我是否应该从其他类继承来在我的小部件中使用事件(实际上我已经尝试过,但是在每种情况下我的Qweb模板都只是从树视图中消失了……)?

1 个答案:

答案 0 :(得分: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');

            });
        }
    });

});