How to Override js function in erpnext v9

Hello,

I am trying to override js function named “calculate_item_values” is available in (erpnext=>erpnext=>public=>js=>controllers=>taxes_and_totals.js) erpnext.
to do a calculation for an amount in sales order lines.

Below is my code, I added in my custom application by creating controllers directory but it not working.

frappe.provide(“erpnext.public”);
frappe.provide(“erpnext.controllers”);
console.log(“:::::::”);
erpnext.TaxesAndTotalsCustomization = erpnext.taxes_and_totals.extend({
setup: function(){},
calculate_item_values: function() {
var me = this;
console.log(“:::::CUSTOM:::::me:::::”,me);
},
})

It is more prior to me. Please help me on this.

Thanks in advance :slight_smile:

2 Likes

This won’t work because even after this, erpnext.taxes_and_totals is used to calculate the values and not your modified function. You can do this:

frappe.provide(“erpnext.public”);
frappe.provide(“erpnext.controllers”);

erpnext.TaxesAndTotalsCustomization = erpnext.taxes_and_totals.extend({
  setup: function(){},
  calculate_item_values: function() {
    var me = this;
    console.log(":::::CUSTOM:::::me:::::", me);
  },
});

erpnext.taxes_and_totals = erpnext.TaxesAndTotalsCustomization;
4 Likes

Hello @netchampfaris,

Thank you for replying. :slight_smile:
I improved my code as per your suggestion but still it not working,
And also tried commands to remove cache.

bench migrate
bench build
bench clear-cache
and then reloaded the browser, but still not working. :thinking:
Thanks

Make sure your js file is loaded. Maybe you’ll have to add it to build.json

Where do I need to add build.json file?
because I am not aware of build.json file.

Yes, my js file is loaded because I added one console.log() at the beginning of my js file and that is print when I reload the browser, because of my js file path is added to hooks.py ( app_include_js = “”).

Thanks

In that case, you dont need to add to build.json, You will have to check whether the erpnext.taxes_and_totals class is available before extending it. Try debugging it using the debugger statement in JS

1 Like

Hello @netchampfaris,

Sry for the late reply.
Thanks for the suggestion. I will try to fix it by the debugger.

Hello @netchampfaris,

Finally, I got the solution to override js function through the prototype.
Below is my code and it works fine.

erpnext.taxes_and_totals.prototype.calculate_item_values = function(){
var me = this;
console.log(“:::::CUSTOM:::::me:::::”,me);
}

Thanks. :slight_smile:

4 Likes

Hi,
Am trying to override the onload function of Item, from custom script. This is my code

frappe.provide(“erpnext.item”);

erpnext.item.prototype.onload = function()
{
frappe.msgprint(‘overriding onload from cust script’);
}

What am I missing?

TIA
Krithi

Hello Krithi,

where did you put this code?
I mean create a New and separate application?
you have to put the code in public directory ( for ex : public=>js=> file.js ) and also add the path of that file in hooks.py. (app_include_js)

Thanks

Yes. In a custom app,added a file under pubic/js/ and referred it in hooks under doctype_js.

Now tried adding under app_include_js also. Didn’t work. Still invokes core ‘onload’.

Hi @yogendrasinh @krithi_ramani I seem to be having a similar issue, I am trying to extend the functionality of the calculate_outstanding_amount method in the same script,
I have done everything stated here (added to app_include_js) and even added the file path to my build.json but still the core method is still being called, can i please get any guidance ? thank you

This is old topic but it came up as first result relating to override JS function, here is how to do it.

const TaxesAndTotalsExtend = erpnext.taxes_and_totals.extend({
	calculate_item_values: () => {
		console.log('Hello from extend taxes and total extend !!');
	},
});

$.extend(
	cur_frm.cscript,
	new TaxesAndTotalsExtend({frm: cur_frm}),
);

It’s work on version 12. Cheers ! :grin:

2 Likes

@pipech can you explain what it is you are doing with your code? Does it completely override the pre existing js or extends it? I tried it and it didn’t seem to work. I’ve been trying to override pre existing js functions.

// TaxesAndTotalsExtend is just variable name
// erpnext.taxes_and_totals is function contain function you want to override
const TaxesAndTotalsExtend = erpnext.taxes_and_totals.extend({
	// calculate_item_values is function you want to override
	calculate_item_values: () => {
		console.log('Hello from extend taxes and total extend !!');
	},
});

// this tell current form to use this override script
$.extend(
	cur_frm.cscript,
	new TaxesAndTotalsExtend({frm: cur_frm}),
);
1 Like

Gotcha… I was thinking it was something completely different. Thank you for the explanation

Is this the same? The code below is called when the is_fixed_asset function is called, but i don’t think it replaces it. Its called from the core JS. I tried your code snippet, and it didn’t seem to work and i kept getting an error. I received a fatal error saying there was no erpnext.item.extend method when the script was called.

Your variation:

const ItemExtend = erpnext.item.extend({
	is_fixed_asset:() => {
		console.log("Hello from extend Item !! ");
	},
});
$.extend(cur_frm.cscript, new ItemExtend({frm: cur_frm}),
);

My variation:

$.extend(erpnext.item, {

    is_fixed_asset_custom: function() {
    		console.log('Some Message');
    },
});

it’s working for me in js but while saving the document its back again i think we need similar code to override taxes_and_totals.py
any idea for that

@Alaa_Badri Creating a customized controller file and calling it via validate doc event of custom app hook will work!

@krithi_ramani
Um hey I’m facing the same issue and I’m using v14
in my custom app in public/js/custom_script.js
is my file and this my code :

const TaxesAndTotalsExtend = erpnext.taxes_and_totals.extend({
    calculate_item_values: function(doc, cdt, cdn) {
        this._super.calculate_item_values.apply(this, arguments); 
        console.log('Hello  !!');
    }
});


$.extend(cur_frm.cscript, new TaxesAndTotalsExtend({ frm: cur_frm }));

but I don’t get the message inside console when I tried changing something in quotation like it didn’t override it at all . hope you can help