如何在行（行）而不是列中组织许多2个复选框？

时间：2018-05-16 09:54:46

标签： xml odoo odoo-10 odoo-view odoo-11

我正在创建一个模块，其中我有Many2many字段，我想将其转换为复选框组。我已经在我的XML视图中写了这个来实现它

<field name="location_ids" widget="many2many_checkboxes"/>

但该字段显示在长列中的所有选项。我想在多行中显示选项，如下图所示：

3 个答案:

答案 0 :(得分：1)

如果您使用的是widget="radio"，那么我们可以根据您的需要提供options="{'horizontal': true}"。您也可以在选择字段上使用小部件广播。所以视图会像这样更新。

代码：

<field name="sale_pricelist_setting" class="oe_inline" widget="radio" options="{'horizontal': true}"/>

<强>之前： enter image description here

横向后： enter image description here

答案 1 :(得分：1)

我想我找到了一个很好的方法。

研究

首先，我搜索了使用小部件many2many_checkboxes呈现的原始模板。这一个：

<t t-name="FieldMany2ManyCheckBoxes">
    <div t-foreach="widget.get('records')" t-as="record">
        <div class="o_checkbox">
            <input t-if="widget.get('value').indexOf(record[0]) !== -1" type="checkbox" t-att-data-record-id="JSON.stringify(record[0])" checked="checked"/>
            <input t-if="widget.get('value').indexOf(record[0]) === -1" type="checkbox" t-att-data-record-id="JSON.stringify(record[0])"/>
            <span/>
        </div>
        <label class="o_form_label"><t t-esc="record[1]"/></label>
    </div>
</t>

模板

所以，我复制了group结构的结果html代码，并将其与小部件的模板相结合。

您需要使用此内容创建一个xml文件，并将其添加到__manifes__.py文件中：

'qweb': ['static/src/xml/many2many_checkboxes.xml', ]

代码many2many_checkboxes.xml 

<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
    <t t-extend="FieldMany2ManyCheckBoxes">
        <t t-jquery="div:first" t-operation="replace">
            <div class="o_group">    
                <table class="o_group o_inner_group o_group_col_6">
                    <tbody>
                        <t t-foreach="widget.m2mValues" t-as="record">
                            <t t-if="record_parity == 'odd'">
                                <t t-set="id_for_label" t-value="'o_many2many_checkbox_' + _.uniqueId()"/>
                                <tr>
                                    <td colspan="1" class="o_td_label">
                                        <label t-att-for="id_for_label" class="o_form_label"><t t-esc="record[1]"/></label>
                                    </td>

                                    <td colspan="1" style="width: 50%;">
                                        <div class="o_checkbox o_form_field_boolean o_form_field">
                                            <div class="o_checkbox">
                                                <input type="checkbox" t-att-id="id_for_label" t-att-data-record-id="JSON.stringify(record[0])"/>
                                                <span/>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            </t>
                        </t>
                    </tbody>
                </table>

                <table class="o_group o_inner_group o_group_col_6 pull-right">
                    <tbody>
                        <t t-foreach="widget.m2mValues" t-as="record">
                            <t t-if="record_parity == 'even'">
                                <t t-set="id_for_label" t-value="'o_many2many_checkbox_' + _.uniqueId()"/>
                                <tr>
                                    <td colspan="1" class="o_td_label">
                                        <label t-att-for="id_for_label" class="o_form_label"><t t-esc="record[1]"/></label>
                                    </td>

                                    <td colspan="1" style="width: 50%;">
                                        <div class="o_checkbox o_form_field_boolean o_form_field">
                                            <div class="o_checkbox">
                                                <input type="checkbox" t-att-id="id_for_label" t-att-data-record-id="JSON.stringify(record[0])"/>
                                                <span/>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            </t>
                        </t>
                    </tbody>
                </table>
            </div>
        </t>
    </t>
</templates>

表格

最后在表单中添加字段。但是没有group元素，因为我们已经在上面的模板上添加了group html元素。您需要添加此属性style="display: block;"才能使网格中的位置保持正确。

<separator string="Field name" />
<field name="test_many2many_checkboxes"
        widget="many2many_checkboxes"
        nolabel="1"
        style="display: block;" />

如果这对您有用，请告诉我。我已经用我的Odoo 11实例进行了测试，它运行正常。这是两列的结果。如果您需要三列，则需要调整模板：

result

可能的替代方案

我已经检查了Odoo开发人员如何在“技术设置”上完成表格。他们正在创建一个单独的表而不是像我一样。所以也许有更好的方法，因为我需要遍历所有记录两次以构建两个表。

无论如何，您可以自由地改进我的代码。我只想引导您找到解决方案。也许你可以将记录分成三组来构建行。

Odoo 10

版本10的模板稍有改动，因此您需要使用此模板：

<t t-extend="FieldMany2ManyCheckBoxes">
    <t t-jquery="div:first" t-operation="replace">
        <div class="o_group">    
            <table class="o_group o_inner_group o_group_col_6">
                <tbody>
                    <t t-foreach="widget.get('records')" t-as="record">
                        <t t-if="record_parity == 'odd'">
                            <tr>
                                <td colspan="1" class="o_td_label">
                                    <label for="o_field_input_28" class="o_form_label" data-original-title="" title="">
                                        <span t-esc="record[1]"/>
                                    </label>
                                </td>

                                <td colspan="1" style="width: 50%;">
                                    <div class="o_checkbox o_form_field_boolean o_form_field">
                                        <div class="o_checkbox">
                                            <input t-if="widget.get('value').indexOf(record[0]) !== -1" type="checkbox" t-att-data-record-id="JSON.stringify(record[0])" checked="checked"/>
                                            <input t-if="widget.get('value').indexOf(record[0]) === -1" type="checkbox" t-att-data-record-id="JSON.stringify(record[0])"/>
                                            <span/>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </t>
                    </t>
                </tbody>
            </table>

            <table class="o_group o_inner_group o_group_col_6 pull-right">
                <tbody>
                    <t t-foreach="widget.get('records')" t-as="record">
                        <t t-if="record_parity == 'even'">
                            <tr>
                                <td colspan="1" class="o_td_label">
                                    <label for="o_field_input_28" class="o_form_label" data-original-title="" title="">
                                        <span t-esc="record[1]"/>
                                    </label>
                                </td>

                                <td colspan="1" style="width: 50%;">
                                    <div class="o_checkbox o_form_field_boolean o_form_field">
                                        <div class="o_checkbox">
                                            <input t-if="widget.get('value').indexOf(record[0]) !== -1" type="checkbox" t-att-data-record-id="JSON.stringify(record[0])" checked="checked"/>
                                            <input t-if="widget.get('value').indexOf(record[0]) === -1" type="checkbox" t-att-data-record-id="JSON.stringify(record[0])"/>
                                            <span/>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </t>
                    </t>
                </tbody>
            </table>
        </div>
    </t>
</t>

答案 2 :(得分：0)

为了实现您的结果，您需要在字段上添加自定义css类，如下所述。

<field name="location_ids widget="many2many_checkboxes" class="your_new_class"/>

创建一个新的css文件并添加以下css。

.your_new_class  > div {
    float:left;
}

<强>解释

如果您根据框架定义widget = many2many_checkboxes，它将为dom中的每个可能值创建一个div。

因此，作为一种解决方案，我们需要创建一个新的css类并将其应用于字段并为您想要的结果添加适当的css属性。

希望这会对你有所帮助。

相关问题
最新问题