Skip to Content
Menu
This question has been flagged
1 Reply
1858 Views

Hello!


I am planning to insert a dynamic html called (approval_workflow_actions) using Widget.

The way it described on the Odoo 16 documentation is really straight forward but for some reason it is not working when Im using widget.appendTo($('.target-element')) but if I use widget.appendTo(document.body) the element successfully inserted.

https://www.odoo.com/documentation/16.0/developer/reference/frontend/javascript_reference.html#widgets

The way I see it is the classname .target-element is not yet loaded thats why appendTo is not working.


Can someone help me?


Sample Code:

------------------------------------------

approval_workflow_actions.js

------------------------------------------

odoo.define('mod_approval_workflow.approval_workflow_actions', function(require){

'use strict'
 
var core = require('web.core');
 
var Widget = require('web.Widget');
 
 
var ActionsWidget = Widget.extend({
 
​template:"temp_approval_workflow.approval_workflow_actions",
 
​init: function (parent) {
this._super(parent);
},
 
});

​// Create the instance
​var actions = new ActionsWidget(this);
 
//Working here
//​actions.appendTo(document.body);
 
​//Not working if I used the classname
​actions.appendTo(".o_control_panel");
 
});

------------------------------------------

temp_approval_workflow.xml

------------------------------------------

xml version="1.0" encoding="UTF-8"?>
<templates>
<div t-name="temp_approval_workflow.approval_workflow_actions">
<buttonclass="btn btn-sm btn-primary">APPROVEbutton>
<buttonclass="btn btn-sm btn-danger">REJECTbutton>

templates>

Thanks you,


Sigmund


Avatar
Discard
Best Answer

Hi,

Try using the following code

In Js:

/** @odoo-module */

import { ControlPanel } from "@web/search/control_panel/control_panel";

export class MyComponent extends Component {
// Your js code
}
MyComponent.template = "module.MyComponent";

ControlPanel.components = {...ControlPanel.components, MyComponent}

in Xml (QWeb):

<?xml version="1.0" encoding="utf-8"?>
<templates xml:space="preserve">
    <t t-name="module.MyComponent" owl="1">
          <!--        Xml code here-->
    </t>
    <t t-inherit="web.ControlPanel" t-inherit-mode="extension" owl="1">
        <xpath expr="//div[hasclass('o_control_panel')]" position="inside">
            <MyComponent/>
        </xpath>
    </t>
</templates>


Regards

Avatar
Discard
Related Posts Replies Views Activity
1
Feb 24
2758
2
Jun 23
2697
0
May 23
1227
1
Jan 19
5000
2
Jul 18
7892