How to override standard js class

class CustomControlAttach extends frappe.ui.form.ControlAttach {
    clear_attachment() {
        let me = this;

        if (this.frm) {
            // Remove the file from the form and refresh
            me.parse_validate_and_set_in_model(null);
            me.refresh();
            me.frm.doc.docstatus == 1 ? me.frm.save("Update") : me.frm.save();
        } else {
            // Handle the case where there's no form context
            this.dataurl = null;
            this.fileobj = null;
            this.set_input(null);
            this.parse_validate_and_set_in_model(null);
            this.refresh();
        }
    }
}

Here i want to change the default functionality of Attach button by removing remove attach functionality how can i do that?

that custom class file added in hooks in app_include_js but standard code running why?

@Rehan_Ansari Please refer this.

it is not a doctype class it is a javascript class?

You have to check the example of hrms:

custom js file

hooks.py
image

I added like this but not working it is correct?

No.

Again check the example of india-compliance app.

1 Like

How to override js class in frappe>

  1. Created one file attach.js in custom app>
// Define the custom class extending frappe.ui.form.ControlAttach
class CustomControlAttach extends frappe.ui.form.ControlAttach {
    // Override the clear_attachment method
    clear_attachment() {
        console.log("Custom clear_attachment method is loaded and executed"); // Add this line
        let me = this;

        if (this.frm) {
            // Remove the file from the form and refresh
            me.parse_validate_and_set_in_model(null);
            me.refresh();
            me.frm.doc.docstatus == 1 ? me.frm.save("Update") : me.frm.save();
        } else {
            // Handle the case where there's no form context
            this.dataurl = null;
            this.fileobj = null;
            this.set_input(null);
            this.parse_validate_and_set_in_model(null);
            this.refresh();
        }
    }
}

// Ensure to use your custom class in the form instead of the default ControlAttach
frappe.ui.form.ControlAttach = CustomControlAttach;

  1. Created project_name.bundle.js file >
import "./attach.js";
  1. Added in Hooks >
app_include_js = [
        "project_name.bundle.js"
        
    ]

Thanks @NCP for guidance :+1:

2 Likes