Skip to Content
Odoo Menu
  • Sign in
  • Try it free
  • Apps
    Finance
    • Accounting
    • Invoicing
    • Expenses
    • Spreadsheet (BI)
    • Documents
    • Sign
    Sales
    • CRM
    • Sales
    • POS Shop
    • POS Restaurant
    • Subscriptions
    • Rental
    Websites
    • Website Builder
    • eCommerce
    • Blog
    • Forum
    • Live Chat
    • eLearning
    Supply Chain
    • Inventory
    • Manufacturing
    • PLM
    • Purchase
    • Maintenance
    • Quality
    Human Resources
    • Employees
    • Recruitment
    • Time Off
    • Appraisals
    • Referrals
    • Fleet
    Marketing
    • Social Marketing
    • Email Marketing
    • SMS Marketing
    • Events
    • Marketing Automation
    • Surveys
    Services
    • Project
    • Timesheets
    • Field Service
    • Helpdesk
    • Planning
    • Appointments
    Productivity
    • Discuss
    • Approvals
    • IoT
    • VoIP
    • Knowledge
    • WhatsApp
    Third party apps Odoo Studio Odoo Cloud Platform
  • Industries
    Retail
    • Book Store
    • Clothing Store
    • Furniture Store
    • Grocery Store
    • Hardware Store
    • Toy Store
    Food & Hospitality
    • Bar and Pub
    • Restaurant
    • Fast Food
    • Guest House
    • Beverage Distributor
    • Hotel
    Real Estate
    • Real Estate Agency
    • Architecture Firm
    • Construction
    • Estate Management
    • Gardening
    • Property Owner Association
    Consulting
    • Accounting Firm
    • Odoo Partner
    • Marketing Agency
    • Law firm
    • Talent Acquisition
    • Audit & Certification
    Manufacturing
    • Textile
    • Metal
    • Furnitures
    • Food
    • Brewery
    • Corporate Gifts
    Health & Fitness
    • Sports Club
    • Eyewear Store
    • Fitness Center
    • Wellness Practitioners
    • Pharmacy
    • Hair Salon
    Trades
    • Handyman
    • IT Hardware & Support
    • Solar Energy Systems
    • Shoe Maker
    • Cleaning Services
    • HVAC Services
    Others
    • Nonprofit Organization
    • Environmental Agency
    • Billboard Rental
    • Photography
    • Bike Leasing
    • Software Reseller
    Browse all Industries
  • Community
    Learn
    • Tutorials
    • Documentation
    • Certifications
    • Training
    • Blog
    • Podcast
    Empower Education
    • Education Program
    • Scale Up! Business Game
    • Visit Odoo
    Get the Software
    • Download
    • Compare Editions
    • Releases
    Collaborate
    • Github
    • Forum
    • Events
    • Translations
    • Become a Partner
    • Services for Partners
    • Register your Accounting Firm
    Get Services
    • Find a Partner
    • Find an Accountant
    • Meet an advisor
    • Implementation Services
    • Customer References
    • Support
    • Upgrades
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    Get a demo
  • Pricing
  • Help

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

  • CRM
  • e-Commerce
  • Accounting
  • Inventory
  • PoS
  • Project
  • MRP
All apps
You need to be registered to interact with the community.
All Posts People Badges
Tags (View all)
odoo accounting v14 pos v15
About this forum
You need to be registered to interact with the community.
All Posts People Badges
Tags (View all)
odoo accounting v14 pos v15
About this forum
Help

How to add radio button widget

Subscribe

Get notified when there's activity on this post

This question has been flagged
10 Replies
67605 Views
Avatar
faizan

as we cant add radio btn directly . in several post i saw it can be addd by widget so how and where i can add radio widget

2
Avatar
Discard
Sehrish

See this: http://learnopenerp.blogspot.com/2020/05/show-one2many-field-records-as-radio-button-in-odoo-wizard.html

Avatar
Serpent Consulting Services Pvt. Ltd.
Best Answer

Hello Faizan,

There is no radio button widget available in v7.

You can get only drop down widget for both selection and many2one fields. However, in v8, there will be a new radio button widget that can be used in view using widget="radio" attribute.

The new radio widget is available now in trunk branch.

Thank you.

4
Avatar
Discard
Avatar
joseph d'souza
Best Answer

There is no radio button widget in v7, but you can add it using widget="radio" attribute.

First you create your own widget [like selection widget] then add python code and XML code like below:

Python Code :

 'syllabus': fields.selection([('one','One'),('two','Two')],'Syllabus'),

XML Code :

<field name="syllabus" widget="radio"/>

Hope It Helps You More !!!

Thanks !

8
Avatar
Discard
Mohammad Alhashash

I think you mean this is possible only in v8.0 which is not released yet.

Avatar
George
Best Answer

Create Sample module web_widget_radio

1) Required files

   __init__.py
   __openerp__.py
   static/src/js/widget_radio.js
   static/src/xml/widget_radio.xml

2) Add following in __openerp__.py

'js': ['static/src/js/widget_radio.js'],
'qweb': ['static/src/xml/widget_radio.xml'],

3) Add following code in static/src/xml/widget_radio.xml

<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
<t t-name="FieldRadio">
    <span t-attf-class="oe_form_field oe_form_field_radio #{widget.options.horizontal ? 'oe_horizontal' : 'oe_vertical'}" t-att-style="widget.node.attrs.style">
        <span t-if="!widget.get('effective_readonly')">
            <t t-if="widget.options.horizontal">
                <t t-set="width" t-value="Math.floor(100 / widget.selection.length)"/>
                <t t-if="!widget.options.no_radiolabel">
                    <t t-foreach="widget.selection" t-as="selection">
                        <label t-att-for="widget.uniqueId + '_' + selection[0]" t-att-style="'width: ' + width + '%;'"><t t-esc="selection[1]"/></label>
                    </t>
                    <br/>
                </t>
                <t t-foreach="widget.selection" t-as="selection">
                    <div t-att-style="'width: ' + width + '%;'">
                        <span class="oe_radio_input"><input type="radio" t-att-name="widget.uniqueId" t-att-id="widget.uniqueId + '_' + selection[0]" t-att-value="selection[0]"/></span>
                    </div>
                </t>
            </t>
            <t t-if="!widget.options.horizontal">
             <html>
                <tr>
                   <t t-foreach="widget.selection" t-as="selection">
                        <span class="oe_radio_input"><input type="radio" t-att-id="widget.uniqueId + '_' + selection[0]" t-att-name="widget.uniqueId" t-att-value="selection[0]"/></span><label t-if="!widget.options.no_radiolabel" t-att-for="widget.uniqueId + '_' + selection[0]"><t t-esc="selection[1]"/></label>
                    </t>
                </tr>
             </html>

            </t>
        </span>
        <span t-if="widget.get('effective_readonly')" class="oe_radio_readonly"><t t-esc="widget.get('value')[1]"/></span>
    </span>
</t>
</templates>

4) Add following code in static/src/js/widget_radio.js

openerp.web_widget_radio = function (instance)
{
    instance.web.form.widgets.add('radio', 'instance.web_widget_radio.FieldRadio');
    instance.web_widget_radio.FieldRadio = instance.web.form.AbstractField.extend(instance.web.form.ReinitializeFieldMixin, {
        template: 'FieldRadio',
        events: {
            'click input': 'click_change_value'
        },
        init: function(field_manager, node) {
            /* Radio button widget: Attributes options:
            * - "horizontal" to display in column
            * - "no_radiolabel" don't display text values
            */
            this._super(field_manager, node);
            this.selection = _.clone(this.field.selection) || [];
            this.domain = false;
        },
        initialize_content: function () {
            this.uniqueId = _.uniqueId("radio");
            this.on("change:effective_readonly", this, this.render_value);
            this.field_manager.on("view_content_has_changed", this, this.get_selection);
            this.get_selection();
        },
        click_change_value: function (event) {
            var val = $(event.target).val();
            val = this.field.type == "selection" ? val : +val;
            if (val == this.get_value()) {
                this.set_value(false);
            } else {
                this.set_value(val);
            }
        },
        /** Get the selection and render it
         *  selection: [[identifier, value_to_display], ...]
         *  For selection fields: this is directly given by this.field.selection
         *  For many2one fields:  perform a search on the relation of the many2one field
         */
        get_selection: function() {
            var self = this;
            var selection = [];
            var def = $.Deferred();
            if (self.field.type == "many2one") {
                var domain = instance.web.pyeval.eval('domain', this.build_domain()) || [];
                if (! _.isEqual(self.domain, domain)) {
                    self.domain = domain;
                    var ds = new instance.web.DataSetStatic(self, self.field.relation, self.build_context());
                    ds.call('search', [self.domain])
                        .then(function (records) {
                            ds.name_get(records).then(function (records) {
                                selection = records;
                                def.resolve();
                            });
                        });
                } else {
                    selection = self.selection;
                    def.resolve();
                }
            }
            else if (self.field.type == "selection") {
                selection = self.field.selection || [];
                def.resolve();
            }
            return def.then(function () {
                if (! _.isEqual(selection, self.selection)) {
                    self.selection = _.clone(selection);
                    self.renderElement();
                    self.render_value();
                }
            });
        },
        set_value: function (value_) {
            if (value_) {
                if (this.field.type == "selection") {
                    value_ = _.find(this.field.selection, function (sel) { return sel[0] == value_;});
                }
                else if (!this.selection.length) {
                    this.selection = [value_];
                }
            }
            this._super(value_);
        },
        get_value: function () {
            var value = this.get('value');
            return value instanceof Array ? value[0] : value;
        },
        render_value: function () {
            var self = this;
            this.$el.toggleClass("oe_readonly", this.get('effective_readonly'));
            this.$("input:checked").prop("checked", false);
            if (this.get_value()) {
                this.$("input").filter(function () {return this.value == self.get_value();}).prop("checked", true);
                this.$(".oe_radio_readonly").text(this.get('value') ? this.get('value')[1] : "");
            }
        }
    });
};

5) Once files are created install the module.Once installation is complete you have done 80% of creating Radio button

6) Few more steps to get 100%

Create Selection field in your_python_file.py

IS_OBSTRUCTED = [ ('yes', 'YES'), ('no', 'NO'), ]

class your_module(osv.osv):
    _name = "your.module"  
    _description = "Your module Description"
    _columns = {
                'is_obstructed':fields.selection(IS_OBSTRUCTED,'Obstructed View?'),
    }
your_module()

Create filed view in XML

    <field name="is_obstructed" widget="radio"/>
2
Avatar
Discard
Avatar
saiharitha varada
Best Answer

Thank u its working

0
Avatar
Discard
Avatar
faizan
Author Best Answer

i got it.. when i download the new version 8 from nightly.openerp.com/trunk/nightly/src/

and change the view file code to <field name="syllabus" widget="radio"/>

then radio btn appears..

thanks for your answers

0
Avatar
Discard
Francesco OpenCode

Please, go to the first answer and set it as correct (click on grey circle that become green). Thanks.

Umashankar Subramani

How to assign a value for widget= radio using xml

Avatar
George
Best Answer

It is possible follow this steps and achieve it.

  1. Create file structure given below Create flolder and name web_widget_radio __init__.py __openerp__.py static/src/js/widget_radio.js static/src/xml/widget_radio.xml

  2. Add these two lines in _openerp_.py 'js': ['static/src/js/widget_radio.js'], 'qweb': ['static/src/xml/widget_radio.xml'], Make _init_.py empty file

  3. Add following code in static/src/xml/widget_radio.xml <templates id="template" xml:space="preserve"> <t t-name="FieldRadio"> <t t-if="widget.options.horizontal"> <t t-set="width" t-value="Math.floor(100 / widget.selection.length)"/> <t t-if="!widget.options.no_radiolabel"> <t t-foreach="widget.selection" t-as="selection"> <label t-att-for="widget.uniqueId + '_' + selection[0]" t-att-style="'width: ' + width + '%;'"><t t-esc="selection[1]"/></label> </t>
    </t> <t t-foreach="widget.selection" t-as="selection">

    <input type="radio" t-att-name="widget.uniqueId" t-att-id="widget.uniqueId + '_' + selection[0]" t-att-value="selection[0]"/>
    </t> </t> <t t-if="!widget.options.horizontal"> <html> <t t-foreach="widget.selection" t-as="selection"> <input type="radio" t-att-id="widget.uniqueId + '_' + selection[0]" t-att-name="widget.uniqueId" t-att-value="selection[0]"/><label t-if="!widget.options.no_radiolabel" t-att-for="widget.uniqueId + '_' + selection[0]"><t t-esc="selection[1]"/></label> </t> </html>

            </t>
        </span>
        <span t-if="widget.get('effective_readonly')" class="oe_radio_readonly"><t t-esc="widget.get('value')[1]"/></span>
    </span>
    

    </t> </templates>

  4. Add following script in static/src/js/widget_radio.js openerp.web_widget_radio = function (instance) { instance.web.form.widgets.add('radio', 'instance.web_widget_radio.FieldRadio'); instance.web_widget_radio.FieldRadio = instance.web.form.AbstractField.extend(instance.web.form.ReinitializeFieldMixin, { template: 'FieldRadio', events: { 'click input': 'click_change_value' }, init: function(field_manager, node) { /* Radio button widget: Attributes options: * - "horizontal" to display in column * - "no_radiolabel" don't display text values / this._super(field_manager, node); this.selection = _.clone(this.field.selection) || []; this.domain = false; }, initialize_content: function () { this.uniqueId = _.uniqueId("radio"); this.on("change:effective_readonly", this, this.render_value); this.field_manager.on("view_content_has_changed", this, this.get_selection); this.get_selection(); }, click_change_value: function (event) { var val = $(event.target).val(); val = this.field.type == "selection" ? val : +val; if (val == this.get_value()) { this.set_value(false); } else { this.set_value(val); } }, /* Get the selection and render it * selection: [[identifier, value_to_display], ...] * For selection fields: this is directly given by this.field.selection * For many2one fields: perform a search on the relation of the many2one field */ get_selection: function() { var self = this; var selection = []; var def = $.Deferred(); if (self.field.type == "many2one") { var domain = instance.web.pyeval.eval('domain', this.build_domain()) || []; if (! _.isEqual(self.domain, domain)) { self.domain = domain; var ds = new instance.web.DataSetStatic(self, self.field.relation, self.build_context()); ds.call('search', [self.domain]) .then(function (records) { ds.name_get(records).then(function (records) { selection = records; def.resolve(); }); }); } else { selection = self.selection; def.resolve(); } } else if (self.field.type == "selection") { selection = self.field.selection || []; def.resolve(); } return def.then(function () { if (! _.isEqual(selection, self.selection)) { self.selection = _.clone(selection); self.renderElement(); self.render_value(); } }); }, set_value: function (value_) { if (value_) { if (this.field.type == "selection") { value_ = _.find(this.field.selection, function (sel) { return sel[0] == value_;}); } else if (!this.selection.length) { this.selection = [value_]; } } this._super(value_); }, get_value: function () { var value = this.get('value'); return value instanceof Array ? value[0] : value; }, render_value: function () { var self = this; this.$el.toggleClass("oe_readonly", this.get('effective_readonly')); this.$("input:checked").prop("checked", false); if (this.get_value()) { this.$("input").filter(function () {return this.value == self.get_value();}).prop("checked", true); this.$(".oe_radio_readonly").text(this.get('value') ? this.get('value')[1] : ""); } } }); }; Finally save all files and restart server and install this module once get installed

    1. How to use it in your view Create module and open your ______________.py file Create selection field IS_OBSTRUCTED = [ ('yes', 'YES'), ('no', 'NO'), ]

Finally OpenERP 7.0 allows you to create radio button

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

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

Sign up
Community
  • Tutorials
  • Documentation
  • Forum
Open Source
  • Download
  • Github
  • Runbot
  • Translations
Services
  • Odoo.sh Hosting
  • Support
  • Upgrade
  • Custom Developments
  • Education
  • Find an Accountant
  • Find a Partner
  • Become a Partner
About us
  • Our company
  • Brand Assets
  • Contact us
  • Jobs
  • Events
  • Podcast
  • Blog
  • Customers
  • Legal • Privacy
  • Security
الْعَرَبيّة 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 is a suite of open source business apps that cover all your company needs: CRM, eCommerce, accounting, inventory, point of sale, project management, etc.

Odoo's unique value proposition is to be at the same time very easy to use and fully integrated.

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