Using js for Web Form

1

I’m working on the web form.
How do I use the boilerplate js files?
(appname/appname/appname/web_form/formname/formname.js).

In the browser console the js file is not loaded (Status 404).
Should I put the path in the hooks? What is the correct path to use?
Is the code inside the frappe.ready function or not?

I can’t get the code works. The same code in Client Script works but not in the files.

Thank you for any inputs.

2

Find out:

  • I can use the boilerplate doctypename.js file in the web_form directory.
  • put the code within the:
frappe.ready(function() {}
  • but can’t use the trigger, something like:
frappe.web_form.on('fieldname', () => {}

frappe.web_form.validate = () => {}
  • now the question is how to use the trigger needed?
3

Hi, Please were you able to solve this? if so what trigger did you use?

4

No I haven’t been able to solve it.
As I remember, I did it the other way… or I leave it… sorry I forgot.

5

Has anyone succeeded in triggering code in the .js file on a field event?

6

The following will change the title of your webform. Use it as an example.

frappe.web_form.after_load = () => {

    let h1Element = document.querySelector('h1.ellipsis');
    if (h1Element) {
        h1Element.innerText = 'Hello World';
    }
}

Place it in the Client Script section of your Web Form.

7

Thanks @Yamen_Zakhour

However this does not answer the question. Code in the embedded Client Script editor on the Web Form does not execute in the .js file of the Web Form. So how do you set a form field event handler in the .js file?