Skip to Content
Odoo Menú
  • Registra entrada
  • Prova-ho gratis
  • Aplicacions
    Finances
    • Comptabilitat
    • Facturació
    • Despeses
    • Full de càlcul (IA)
    • Documents
    • Signatura
    Vendes
    • CRM
    • Vendes
    • Punt de venda per a botigues
    • Punt de venda per a restaurants
    • Subscripcions
    • Lloguer
    Imatges de llocs web
    • Creació de llocs web
    • Comerç electrònic
    • Blog
    • Fòrum
    • Xat en directe
    • Aprenentatge en línia
    Cadena de subministrament
    • Inventari
    • Fabricació
    • PLM
    • Compres
    • Manteniment
    • Qualitat
    Recursos humans
    • Empleats
    • Reclutament
    • Absències
    • Avaluacions
    • Recomanacions
    • Flota
    Màrqueting
    • Màrqueting Social
    • Màrqueting per correu electrònic
    • Màrqueting per SMS
    • Esdeveniments
    • Automatització del màrqueting
    • Enquestes
    Serveis
    • Projectes
    • Fulls d'hores
    • Servei de camp
    • Suport
    • Planificació
    • Cites
    Productivitat
    • Converses
    • Validacions
    • IoT
    • VoIP
    • Coneixements
    • WhatsApp
    Aplicacions de tercers Odoo Studio Plataforma d'Odoo al núvol
  • Sectors
    Comerç al detall
    • Llibreria
    • Botiga de roba
    • Botiga de mobles
    • Botiga d'ultramarins
    • Ferreteria
    • Botiga de joguines
    Food & Hospitality
    • Bar i pub
    • Restaurant
    • Menjar ràpid
    • Guest House
    • Distribuïdor de begudes
    • Hotel
    Immobiliari
    • Agència immobiliària
    • Estudi d'arquitectura
    • Construcció
    • Gestió immobiliària
    • Jardineria
    • Associació de propietaris de béns immobles
    Consultoria
    • Empresa comptable
    • Partner d'Odoo
    • Agència de màrqueting
    • Bufet d'advocats
    • Captació de talent
    • Auditoria i certificació
    Fabricació
    • Textile
    • Metal
    • Mobles
    • Menjar
    • Brewery
    • Regals corporatius
    Salut i fitness
    • Club d'esport
    • Òptica
    • Centre de fitness
    • Especialistes en benestar
    • Farmàcia
    • Perruqueria
    Trades
    • Servei de manteniment
    • Hardware i suport informàtic
    • Sistemes d'energia solar
    • Shoe Maker
    • Serveis de neteja
    • Instal·lacions HVAC
    Altres
    • Nonprofit Organization
    • Agència del medi ambient
    • Lloguer de panells publicitaris
    • Fotografia
    • Lloguer de bicicletes
    • Distribuïdors de programari
    Browse all Industries
  • Comunitat
    Aprèn
    • Tutorials
    • Documentació
    • Certificacions
    • Formació
    • Blog
    • Pòdcast
    Potenciar l'educació
    • Programa educatiu
    • Scale-Up! El joc empresarial
    • Visita Odoo
    Obtindre el programari
    • Descarregar
    • Comparar edicions
    • Novetats de les versions
    Col·laborar
    • GitHub
    • Fòrum
    • Esdeveniments
    • Traduccions
    • Converteix-te en partner
    • Services for Partners
    • Registra la teva empresa comptable
    Obtindre els serveis
    • Troba un partner
    • Troba un comptable
    • Contacta amb un expert
    • Serveis d'implementació
    • Referències del client
    • Suport
    • Actualitzacions
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    Programar una demo
  • Preus
  • Ajuda

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

  • CRM
  • e-Commerce
  • Comptabilitat
  • Inventari
  • PoS
  • Projectes
  • MRP
All apps
You need to be registered to interact with the community.
All Posts People Badges
Etiquetes (View all)
odoo accounting v14 pos v15
About this forum
You need to be registered to interact with the community.
All Posts People Badges
Etiquetes (View all)
odoo accounting v14 pos v15
About this forum
Ajuda

publicWidget.Widget.extend example

Subscriure's

Get notified when there's activity on this post

This question has been flagged
frontendWidgets
1 Respondre
13375 Vistes
Avatar
Francesco Ballerini

I want to make an rpc call using the helper this._rpc but I only want to execute this on 'my/account' route. I think there are serveral ways to achieve this task in js side, I like this one because I found this comment on PublicWidget 'class':

/**
* The selector attribute, if defined, allows to automatically create an
* instance of this widget on page load for each DOM element which
* matches this selector. The `PublicWidget.$target` element will then be
* that particular DOM element. This should be the main way of instantiating
* `PublicWidget` elements.
*
*/

There are PLENTY of examples on source code, so and I created a js module and outside the scope of widget.extend is working properly (can load js-module and can read console log instructions) but when I go into the scope of widget.extend I cannot see my custom widget properties and handlers are not executed anymore, but the console does not show any errors.

I declared assets_xml (module is loading properly), created js file that is logging infos correctly and extended '/my/account' form to append the selector. Can some one give me a good advice to make my instructions execute ? What am I missing to make this work?


Update: I tried to console.log the registry itself instead of a generic string, it log and I see that my widget is correctly added to prototype object, as I stated in updated comment, also, the selector seems ok, the only thing it comes to my mind is the 'momentum' when my js code is executed, maybe it should be loaded after template is rendered (that would make sense to me) but I'm not sure if that's the matter and I'm not sure what I should do here. I defined assets.xml before the template with id "portal_details_extend_widget" , but even if I switch the position in the manifest I don't see relevant changes, meaning that code inside widget still not executed.


JS MODULE:

odoo.define("idro_portal.my_account_extend", function (require) {
"use strict";

var publicWidget = require('web.public.widget');
var core = require('web.core');
var ServicesMixin = require('web.ServicesMixin');
var webSession = require('web.session');
var rootWidget = require('root.widget');

console.log('logging') //CAN see in console
publicWidget.registry.PublicWidgetMyAccountExtend = publicWidget.Widget.extend({
selector: '.custom_public_widget_extend',

start: function () {
var res = this._super.apply(this, arguments);
console.log('publicwidget'); // CANNOT see in console
this.do_notify('Success', 'Start function notify'); // does NOT work, but also NOT raise any error
return res
},
});
console.log(publicWidget)
//This console.log show object 'registry' in console, if I expand
//I can find 'PublicWidgetMyAccountExtend' in 'registry' key, so it's added
return publicWidget.registry.PublicWidgetMyAccountExtend;});

LOAD SCRIPT IN THE ASSET BUNDLE FRONTEND:

​
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="assets_frontend" inherit_id="web.assets_frontend" name="Portal Extend JS">
<xpath expr="//script[last()]" position="after">
<script type="text/javascript" src="/idro_portal/static/src/js/my_account_extend.js"/>
</xpath>
</template>
</odoo>


DEFINE SELECTOR IN THE FORM:

<?xml version="1.0" encoding="utf-8"?>
<odoo>
<!-- ADD SELECTOR CLASS TO RUN THE JS WIDGET SCRIPT -->
<template id="portal_details_extend_widget" inherit_id="portal.portal_my_details" name="User Profile Extend">
<xpath expr="//form" position="attributes">
<attribute name="class" add="custom_public_widget_extend" separator=" "/>
</xpath>
</template></odoo>
0
Avatar
Descartar
Avatar
Francesco Ballerini
Autor Best Answer

I figured out: selector is not enough to make publicWidget work on website. 

It just create an istance of the widget for each element matched by the selector but then you need to render the widget to make use of it. One way to achieve this task is by using the following code to initialize, render, and put the widget in the DOM:

*     var myWidget = new MyWidget(this);
* myWidget.appendTo($(".some-div"));

The following snippet works well in the website

odoo.define("idro_portal.my_account_extend", function (require) {
"use strict";

var core = require('web.core');
var publicWidget = require('web.public.widget');

publicWidget.registry.PublicWidgetMyAccountExtend = publicWidget.Widget.extend({
selector: '.custom_public_widget_extend',

start: function () {
var res = this._super.apply(this, arguments);
this.do_notify('Success', 'Widget start notify');
return res
},
});
var PublicWidgetMyAccountExtend = new publicWidget.registry.PublicWidgetMyAccountExtend(this);
PublicWidgetMyAccountExtend.appendTo($(".custom_public_widget_extend"));
return publicWidget.registry.PublicWidgetMyAccountExtend;
});


0
Avatar
Descartar
Enjoying the discussion? Don't just read, join in!

Create an account today to enjoy exclusive features and engage with our awesome community!

Registrar-se
Related Posts Respostes Vistes Activitat
widget many2many_list not working v13 Solved
Widgets
Avatar
2
de des. 22
1291
Front-end Odoo language
frontend
Avatar
Avatar
1
d’ag. 22
7861
What is we-button, we-collapse like things?
frontend
Avatar
0
de jul. 20
4125
how to reload widget on every product form view? Solved
Widgets
Avatar
Avatar
3
d’abr. 17
10786
URL
url frontend
Avatar
0
de nov. 23
2254
Community
  • Tutorials
  • Documentació
  • Fòrum
Codi obert
  • Descarregar
  • GitHub
  • Runbot
  • Traduccions
Serveis
  • Allotjament a Odoo.sh
  • Suport
  • Actualització
  • Desenvolupaments personalitzats
  • Educació
  • Troba un comptable
  • Troba un partner
  • Converteix-te en partner
Sobre nosaltres
  • La nostra empresa
  • Actius de marca
  • Contacta amb nosaltres
  • Llocs de treball
  • Esdeveniments
  • Pòdcast
  • Blog
  • Clients
  • Informació legal • Privacitat
  • Seguretat
الْعَرَبيّة Català 简体中文 繁體中文 (台灣) Čeština Dansk Nederlands English Suomi Français Deutsch हिंदी Bahasa Indonesia Italiano 日本語 한국어 (KR) Lietuvių kalba Język polski Português (BR) română русский язык Slovenský jazyk slovenščina Español (América Latina) Español ภาษาไทย Türkçe українська Tiếng Việt

Odoo és un conjunt d'aplicacions empresarials de codi obert que cobreix totes les necessitats de la teva empresa: CRM, comerç electrònic, comptabilitat, inventari, punt de venda, gestió de projectes, etc.

La proposta única de valor d'Odoo és ser molt fàcil d'utilitzar i estar totalment integrat, ambdues alhora.

Website made with

Odoo Experience on YouTube

1. Use the live chat to ask your questions.
2. The operator answers within a few minutes.

Live support on Youtube
Watch now