Custom App and call JS functions in custom_app.js

[charleslcso]

Hello,

I have a working Custom App to add features to Desk, not DocType form. Now one of the new features is to add a button, onclick() will call a function in custom_app.js (of which is already in hooks.js’ app_include_js.

For example in list_view.js I added a button,

< button class = “btn btn-messages-whatsapp” onclick=“sendWhatsApp();”>

The custom_app.js has a traditional JS function, for example,

function sendWhatsApp() {
alert(“Hi”);
}

which doesn’t seem to work.

How should I write the JS code in custom_app.js?

[TurkerTunali]

This may help Get more done with ERPNext by button in list view - YouTube

[avc]

Hi:

You can add a button to listview with a simple client script, this way:

Create a client script, assigned to your doctype (remind assign to your custom app and enable it!)

frappe.listview_settings['yourDoctype'] = {
    hide_name_column: true,
    onload(listview) { 
        listview.page.add_inner_button(__("Button"), () => yourFunction());
    }
}

function yourFunction() {
    msgprint('Hellooooo');
}

Hope this helps.

[charleslcso]

Thank you @TurkerTunali and @avc for your pointers. I thought Client Script only works when we are editing DocType forms; now it seems it is possible to also work in Desk outside of Forms!

Great, and I’ll give it a try!

Ta!

[avc]

Client script runs on form or list view, depending of your choice:

[charleslcso]

Hi @avc unfortunately this code is not working in v13.49.

The code is there in browser Source, but the button just won’t show up. @TurkerTunali 's code will show a button (taken from List), and from the doc it says 1 button can be added. I need to add more than 1 button.

I prefer to use your approach because from your code I can call vanilla JS (so I don’t have to be an expert in Client Script and can still get something done urgently).

Any idea on why the button is not showing?

Here is what I have done myself, by modifying list_view.js:

Again, my trouble is I can’t get the buttons to register a proper event, and call vanilla JS functions.

I’m sorry @avc! The button is added outside of the list! Ha ha ha.