skip to Main Content

I’ve made some new modules in my Odoo and now when each form is loading I need to manipulate the created XML elements according to its required model and my arbitrary changes or refer to some specific function for its data validation (I know there are other ways for data validation but I’m curious if it’s possible to be done with jquery functions).

I’ve tried to add an HTML file in the view folder and write a simple script, to begin with, but I’m not sure if it’s the right place or even the right piece of code.

<script>
    $(document).ready(function()
    {  
        $("input").keyup(function(event){
            console.log('t');
        });
    });
</script>

I would be glad if anyone could offer some useful answers to my question.

3

Answers


  1. if you want to use jquery or any js library you need to put them in this file under this path /your_app/static/src/js/test.js
    and the file should be like this :

    $(document).ready(function()
    {  
        $("input").keyup(function(event){
            console.log('t');
        });
    });
    

    and you need to add the assets for this work like that :

    'assets': {'web.assets_qweb': ['/your_app/static/src/js/test.js']} #path of the file
    

    this for jquery not for building js model in odoo

    Login or Signup to reply.
  2. For back-office javascript, consider using the "Odoo built-in js library":

    In your custom module "my_custom_module":
    Create a new file /my_custom_module/static/src/js/my_customization.js:

        odoo.define('my_custom_module.switch_to_gantt', function(require) {
            "use strict";
        
        var core = require('web.core');
        var _t = core._t;
        var AbstractController = require('web.AbstractController');
        
        AbstractController.include({
        
            /**
             * Original : Intercepts the 'switch_view' event to add the controllerID into the data, and lets the event bubble up.
             * Included : On switching from Kanban to Gantt view : Remove all the GroupBy Filters because it caused Error
             */
           _onSwitchView: function (ev) {
           console.log(ev.data.view_type);
                //debugger;
    /* only on the specific view : gantt: */
                if(ev.data.view_type == 'gantt')
                {
    /* only on the specific model : event.event: */
                if(ev.target.modelName == 'event.event')
                    $('.o_searchview .o_facet_remove').click();
                }
                this._super.apply(this, arguments);
        
             },
        });
        });
    

    And declare this asset in the __manifest__.py file:

    'assets': {'web.assets_qweb': ['/my_custom_module/static/src/js/my_customization.js']}
    
    Login or Signup to reply.
  3. You can customize an existing form view using the js_class attribute, its value will be the name of an extended form view.

    To bind a new event to an input, you can customize the form controller and extend the events mapping.

    Example:

    1) Extend the form view:

    odoo.define("MODULE_NAME.custom_form", function (require) {
        "use strict";
    
        var FormController = require('web.FormController');
        var FormView = require('web.FormView');
        var viewRegistry = require('web.view_registry');
    
        var CustomController = FormController.extend({
    
            events: _.extend({}, FormController.prototype.events, {
                'keyup input': '_onInputKeyup',
            }),
    
            _onInputKeyup(ev) {
                console.log('t');
            },
    
        });
    
        var CustomFormView = FormView.extend({
            config: _.extend({}, FormView.prototype.config, {
                Controller: CustomController,
            }),
        });
    
        viewRegistry.add('custom_form', CustomFormView);
    
        return {
            CustomController: CustomController,
            CustomFormView: CustomFormView,
        };
    
    });
    

    2) Add it to the assets entry in the manifest file

    'assets': {
        'web.assets_backend': [
            'MODULE_NAME/static/src/js/custom_form_view.js'
        ],
    },
    

    3) Set the js_class attribute on the form view tag

    <form js_class="custom_form">
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search