Recalculate field with JS - javascript

I am trying to recalculate one field in Odoo based on another field so for example my model is following:
class ProductTemplate(models.Model):
_inherit = 'product.template'
margin = fields.Float()
netto_price = fields.Float()
So based on netto_price i would like to calculate margin. Now i added js file to /static/src/js/products.js and in openerp.py i added 'js': ['static/src/js/products.js'],
Than i wrote following js just to try if its working or not
openerp.product_mycustom = function(instance) {
var QWeb = openerp.web.qweb;
_t = instance.web._t;
instance.web.FormView.include({
load_form: function(data) {
var self = this;
this.$el.find('#netto_price').on('change', function() {
alert( this.value );
});
},
});
};
And no success. Am i doing something wrong

Related

ol-ext Control Bar and function in the Controller

I have an extjs app in which I am using an ol-ext control bar. The control bar is in the file MyApp.js and the function that I want to call clicking on the button belonging the control bar is in the relative controller MyAppController.
In MyApp.js:
var testFuction = function(){
return this.getController().updateImages;
};
var mainbar = new ol.control.Bar();
var first = new ol.control.Button (
{
html: '1',
//handler: 'updateImages',
//reference: 'locationShowImageButton',
handleClick: testFuction,
});
//Standard Controls
mainbar.addControl (first);
mainbar.setPosition('bottom-right');
this.map.addControl(mainbar);
In MyAppController:
updateImages: function (obj) {
var self = this;
this.getView().cleanImageLayers();
var selectedFloors = ; //it should be the value of the ol.control.Button, so 1
if (this.lookupReference('locationShowImageButton').pressed) {
.....
First check if this.getController() in MyApp.js refer to MyAppController.
You can't use ol.control.Button like sencha component.
You should use this in your MyApp.js scope.
var mainbar = new ol.control.Bar();
var me = this;
var first = new ol.control.Button (
{
html: '1',
handleClick: function () {
me.getController().updateImages();
}
});
//Standard Controls
mainbar.addControl (first);
mainbar.setPosition('bottom-right');
this.map.addControl(mainbar);

CodeMirror - insert text into editor when there are multiple editors

I have two codemirror editors on one page. A drop down list of items and radio group to target the correct editor.
What I want to do is on change of the drop down list insert the value of the item into the targeted editor (deleted by the radio group).
my code is as below: however the function isnt working. When I alert the item value and the target I get expected results, however the function to insert the text is failing:
<script type="text/javascript">
function editor(id) {
var editor = CodeMirror.fromTextArea(id, {
continuousScanning: 500,
lineNumbers: true
});
editor.setSize(null, 550);
}
var config_id = document.getElementById('id_config')
var config = editor(config_id);
var remote_config_id = document.getElementById('id_remote_config')
var remote_config = editor(remote_config_id);
function insertStringInTemplate(str, target) {
if (target== "id_config") {
var doc = config
} else {
var doc = remote_config
}
var cursor = doc.getCursor();
var pos = {
line: cursor.line,
ch: cursor.ch
}
doc.replaceRange(str, pos);
}
$(function(){
// bind change event to select
$('#template_vars').on('change', function () {
var var_data = $(this).val(); // get selected value
var var_target = $('input[name=target]:checked').val();
insertStringInTemplate(var_data, var_target)
return false;
});
});
$("#template_vars").chosen({no_results_text: "Oops, nothing found!"});
</script>
however the function to insert the text is failing
That function (i.e. insertStringInTemplate()) is working good/properly; however, the problem is with the editor() function, where you forgot to return the editor (i.e. the CodeMirror instance).
So a simple fix would be:
function editor(id) {
var editor = CodeMirror.fromTextArea(id, {
continuousScanning: 500,
lineNumbers: true
});
editor.setSize(null, 550);
return editor; // <- here's the fix
}
Demo on CodePen.
However in that demo, I added an if block to the insertStringInTemplate() function, as in the following code:
function insertStringInTemplate(str, target) {
if (target== "id_config") {
var doc = config
} else {
var doc = remote_config
}
// If there's a selection, replace the selection.
if ( doc.somethingSelected() ) {
doc.replaceSelection( str );
return;
}
// Otherwise, we insert at the cursor position.
var cursor = doc.getCursor();
var pos = {
line: cursor.line,
ch: cursor.ch
}
doc.replaceRange(str, pos);
}

How can I check when certain form view is opened and field has changed in it on Odoo JavaScript?

What I Have so far is basic code:
odoo.define('partner_data.res_partner_widget', function(require) {
"use strict";
var core = require('web.core');
var Dialog = require('web.Dialog');
var form_common = require('web.form_common');
var Widget = require('web.Widget');
var Model = require('web.Model');
var _t = core._t;
var QWeb = core.qweb;
console.log('JS loaded');
$(document).on('ready', function() {
console.log('Doc is ready');
$('#FIELD').on('change', function() {
// Change value of other fields in this form
});
});
});
Problem is that document ready triggers in whole ODOO system. And trying to find the field by its name $(#fieldname) doesn't work at all.
Is there any solution SPECIFIC FOR ODOO for this problem? Or maybe you know really good documentation or example that explain on change method OF ODOO FIELD. P.S. I write ODOO in caps because everybody answers simple JQuery style, and this is not just simple JQuery, this must be something more specific related to ODOO.
Or maybe I can call Python function of specific form view after the field has been changed, something like that. All odoo documentation that I found gives very little or no information about that.
UPDATE:
Thanks to #Vishal Khichadiya I got a bit close. I edited his answer by creating a widget. Now when I set this widget to the random field, let's say to some invisible field, I can use class class_partner on any field I want and it will trigger onchange method.
odoo.define('partner_data.res_partner_widget', function(require) {
"use strict";
var base = require('web_editor.base');
var options = require('web_editor.snippets.options');
var core = require('web.core');
var Dialog = require('web.Dialog');
var session = require('web.session');
var form_common = require('web.form_common');
var Widget = require('web.Widget');
var Model = require('web.Model');
var _t = core._t;
var QWeb = core.qweb;
var onchange_js_method_test = form_common.AbstractField.extend({
start: function () {
this._super();
var self = this;
$('body').on('change', '.class_partner', function() {
console.log('start triggered');
console.log(self)
// Change value of other fields in this form
//you can call python function from here to set your value
});
}
});
core.form_widget_registry.add('onchange_js_method_test', onchange_js_method_test);
});
xml:
<field name="random_invisible" " widget="onchange_js_method_test"/>
<field name="on_this_field_onchange_triggers" class="class_partner"/>
first of all you need to set class attribute to python filed in xml code.
Ex:
<field name="partner_id" class="class_partner" />
then you need this in js and also add this js file to assets_backend.
odoo.define('partner_data.res_partner_widget', function(require) {
"use strict";
var core = require('web.core');
var Dialog = require('web.Dialog');
var form_common = require('web.form_common');
var Widget = require('web.Widget');
var Model = require('web.Model');
var _t = core._t;
var QWeb = core.qweb;
var my_widget = Widget.extend({
start: function () {
this._super();
var self = this;
$('body').on('change', '.class_partner',function() {
// Change value of other fields in this form
//you can call python function from here to set your value
});
},
});
core.action_registry.add('my_widget', my_widget);
return my_widget;
});

Make field invisible via js code - ODOO 9

I'm looking for a method which makes a field invisible on js (i'm making a custom widget 'InvisibleIfEmptry').
I tried to override _check_visibility method when extending FormWidget.AbstractField class :
var core = require('web.core'),
form_common = require('web.form_common');
var InvisibleIfEmpty = form_common.AbstractField.extend({
start: function() {
this.on("change:effective_readonly", this, function() {
this._toggle_label();
this._check_visibility();
});
this.render_value();
this._toggle_label();
},
_check_visibility: function() {
if (this.get("effective_readonly"))
this.$el.toggleClass('o_form_invisible',true);
}
this.$el.toggleClass('o_form_invisible',false);
}
}, .....
but this makes invisible only the field's value, not the label.
my guess is to alter some of field_manager's values but i can't figure out which one ?
Thank you for your help :)
Here is my JS code for doing that :
odoo.define('myCustomModule', function(require)
{
'use strict';
var core = require('web.core'),
form_common = require('web.form_common'),
form_view = require('web.FormView');
form_common.AbstractField.include({
start: function() {
this._super();
// Check visibility logic below when content
// changes or the form swich to view mode
this.field_manager.on("view_content_has_changed", this, function() {
this._check_visibility();
});
this.on("change:effective_readonly", this, function() {
this._toggle_label();
this._check_visibility();
});
},
_check_visibility: function() {
// If the form is in view mode and the field is empty,
// make the field invisible
window.alert(this.);
if (this.field_manager.get("actual_mode") === "view" ) {
if(this.get("value") == false){
this.$el.toggleClass('o_form_invisible',true);
this.$label.toggleClass('o_form_invisible',true);
}else{
this.$el.toggleClass('o_form_invisible',this.get("effective_invisible"));
this.$label.toggleClass('o_form_invisible',this.get("effective_invisible"));
}
}else{
this.$el.toggleClass('o_form_invisible',this.get("effective_invisible"));
this.$label.toggleClass('o_form_invisible',this.get("effective_invisible"));
}
},
});
});
But this applies to all my modules.
Does Any one know how to get module/model name from AbstractField ?

Enyo JS : Set moon.DataGridList collection dynamically

Is there away to set a grid collection dynamically after an ajax call ?
.....
create: function () {
this.inherited(arguments);
this.onFetchItemList();
},
onFetchItemList: function(){
var prof = this.userProfile;
obj.getBrowse(prof,function onBrowseCallback(list){
this.set("collection", new enyo.Collection(list));
});
}
.....
I get this method is undefined when I try to use the set function
this.$.gridList.set("collection" ,new enyo.Collection(list));
same error here as well :
this.$.gridList.collection.set('collection',this.shows);
Fixed, simply mistake on my part , whoops :)
onFetchItemList: function(inSender, inEvent){
var prof = this.userProfile;
var _gridList = this.$.gridList;
var shows = new enyo.Collection();
obj.getBrowse(prof,function onBrowseCallback(list){
ameba_lastListViewed = [];
ameba_lastListViewed = list;
shows = new enyo.Collection(list);
_gridList.set('collection',shows);
}

Categories

Resources