Form View hide button via CSS

Viewed 696

On Form View i want to hide a button if Customer partner_id is False, i tried t-if with no luck i tied attrs but also didnt work.

Check status of Customer partner_id:

enter image description here

I want to hide the button Send Message:

enter image description here

Any solution?

I tried to run CSS to hide the button

My Code:

<field name="name" attrs="{'invisible': [('partner_id', '=', False)]}">
      <style>
        .o_chatter_button_new_message {
                display: none !important;
        }
      </style>
      </field>
2 Answers

You can do it in FormRenderer and to hide or show the button when the value of partner_id changes you can create a new many2one widget by extending FieldMany2One and changing the visibility state of the button depending on the value of partner_id.

In the following example, the Send Message button will be hidden if the partner_id is defined when the form view is loaded or when the value of partner_id is set to false. The button should be visible when the value of the partner is set (onchange event).

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

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

    FormRenderer.include({

        autofocus: function () {
            var self = this;
            if(self.state.model === 'project.task' && self.state.data.partner_id===false){
                var node = window.$('button.o_chatter_button_new_message');
                node.hide();
            }
            return this._super();
        },
    });

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

    var FieldMany2One = relational_fields.FieldMany2One.extend({

        _onFieldChanged: function (event) {
            var node = window.$('button.o_chatter_button_new_message');
            if (event.data.changes[event.target.name]===false) {
                node.hide();
            } else {
                node.show();
            }

            this._super(event);
        },
    });

    fieldRegistry.add('hideSendMsg', FieldMany2One);
});

You should add the js file in an asset bundle.

To use the widget defined above you will need to set the widget attribute of the partner_id field to hideSendMsg in the XML definition.

<record id="view_task_form2_inherit" model="ir.ui.view">
    <field name="name">view.task.form2.inherit</field>
    <field name="model">project.task</field>
    <field name="inherit_id" ref="project.view_task_form2"/>
    <field name="arch" type="xml">
        <field name="partner_id" position="attributes">
            <attribute name="widget">hideSendMsg</attribute>
        </field>
    </field>
</record>

=============================================================

My Solution: @Fotic

<script type="text/javascript">
        document.onload = check_status();
        document.onchange = check_status();
        function check_status() {
            if (document.getElementById("o_field_input_103")){
                var hasCSSClass = document.getElementById("o_field_input_103")
            }
            if (hasCSSClass){
              if ( hasCSSClass.classList.contains("o_field_empty") || hasCSSClass.classList.contains("o_input")) {
                  $(".o_chatter_button_new_message").show();
                  console.log("1111111111");
              } else{
                  $(".o_chatter_button_new_message").hide();
                  console.log("2222222222");
              }
            }
        }

    </script>

It can not be possible with the approach you did. The Send message button is dynamically rendered and it's defined in the Qweb template.

You can find the Button Code here,Click Here

Solution: To hide the button you can do it from the js where the button renders and passed value[with check the partner_id is False] and added the condition on the button itself.

Thanks

Related