Come creare e usare un Dialog in Odoo

(per non romperlo)

Matteo Piciucchi

Questo tutorial ti svelerà i segreti dei Dialog in Odoo.


In alcune applicazioni può essere necessario l’utilizzo di Dialog Box per interagire con l’utente o più semplicemente per mostrare un semplice messaggio.
Il Framework Javascript di Odoo ci mette a disposizione una classe apposita chiamata Dialog.

Per prima cosa bisogna richiamare la classe Dialog nel proprio modulo:

Dichiarazione Dialog


Bisogna poi istanziare il nostro Dialog con i parametri utili al nostro scopo:

Istanziare Dialog con parametri

Infine apriamo il nostro Dialog appena creato:

Apertura Dialog

Di seguito mostrerò alcuni semplici esempi.

ESEMPIO 1:

A seguito dell’esecuzione di una funzione vogliamo restituire un feedback sull’esito all’utente.
In questo caso ci può essere utile un Dialog che mostri solo un messaggio e il bottone “OK” per chiudere il Dialog stesso.
Per questo tipo di Dialog ci basta settare:
  • il titolo;
  • il sottotilo;
  • il contenuto del Dialog.
Esempio 1: Dialog con testo e button

Puoi notare il parametro size che rappresenta la grandezza del Dialog e può essere settato a tre valori:
  • small’,
  • medium,
  • large.
Il valore di default è ‘large’.

Nel parametro $content si può inserire html a piacere.

Ecco il risultato:
Risultato Dialog con testo e button




ESEMPIO 2:

Vogliamo restituire un Dialog contenente un template precedentemente creato.


Per prima cosa dobbiamo richiamare la classe Qweb di Odoo:

Richiamo classe Qweb di Odoo


A questo punto modifichiamo il parametro $content del nostro Dialog in questo modo:


Modifica parametro $content


Dove test_dialog_template è il nostro template:
Template in html

Il risultato sarà il seguente:
Risultato esempio 2



ESEMPIO 3:

Vogliamo aggiungere un bottone nel footer del Dialog che se premuto esegue una funzione. Nel nostro semplice esempio faremo eseguire un alert.
Per fare ciò ci basta aggiungere il parametro buttons. Questo parametro è una lista di array. Ogni elemento della lista rappresenta il nostro bottone ed ha dei parametri da settare:
  • text: il testo del bottone
  • classes: le classi del bottone (btn-primary etc…)
  • click: la funzione che deve eseguire quando viene premuto
  • disabled: se true il bottone sarà disabilitato
  • close: se true una volta premuto oltre ad eseguire la funzione in click chiude anche il Dialog.
Dialog con footer

Ecco il risultato:
Risultato esempio 3, dialog con testo, button e footer

In ultimo ti vorrei parlare di altri due parametri per il tuo Dialog che potrebbero tornarti utili:

  • fullscreen;
  • dialogClass.

Il primo se settato a true restituirà un dialog a tutto schermo per la modalità mobile mentre il secondo aggiunge una classe al modal-body.

Di seguito un’immagine di un Dialog fullscreen su un dispositivo mobile ( carino, vero? Immagina quante cose potrai implementarci):

Dialog fullscreen


CONCLUSIONI:

Ora che conosci come usare al meglio i Dialog in Odoo puoi divertirti a usarli nei modi più disparati possibili, integrandoli con html o template di varia natura o aggiungendo funzioni complesse alla pressione dei bottoni.

Spero che questa mia piccola guida ti sia stata d'aiuto!
Se anche tu vuoi iniziare con ODOO e cerchi un valido supporto, non esitare a contattarci!

Stay tuned!

Odoo • Immagine e testo

Matteo Piciucchi

- Odoo Developer -