How to create a first custome widget in odoo

1). Add js and xml file under resource folder.



aslo add these files on file


2). petstore.js

openerp.petstore = function(instance, local) {

instance.web.form.widgets = instance.web.form.widgets.extend(
‘test’ : ‘instance.web.form.message’,

instance.web.form.message = instance.web.form.FieldChar.extend(
template: ‘test’,
start: function() {
var self=this;

show_message :function(){


3). rootfolder/static/src/xml/petstore.xml   (Qweb template file)

<?xml version=”1.0″ encoding=”utf-8″?>
<t t-name=”test”>
<button name=”view_images” type=”object” id=”message” >Alert</button>


4). call widget on data template

attach js and css on data file

<template id=”assets_backend” name=”petstore_assets” inherit_id=”web.assets_backend”>
<xpath expr=”.” position=”inside”>
<link rel=”stylesheet” href=”/petstore/static/src/css/petstore.css”/>
<script type=”text/javascript” src=”/petstore/static/src/js/petstore.js”/>

call widget

<field name=”name” widget=”test”/>

download source


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s