I want to modify the behaviour of an Angular form.

The answer to question 4700 tells me 'how' to do it (add some JavaScript), but I'm interested in 'where' to do it.

If it was a PHP form I could use a hook. Should I use an extension?


1 Answer 1


I usually do it in an extension. This allows me to enable/disable changes at will.

  1. Create an extension with Civix (eg com.example.myextension).
  2. Inside the extension folder create (eg [ext_dir]/com.example.myextension/js/) folder.
  3. Create your JS file in there (eg [ext_dir]/com.example.myextension/js/mychanges.js)
  4. In the main extension file (eg [ext_dir]/com.example.myextension/myextension.php) add this hook. I think its called on all pages and forms -- may have to use pageRun or alterContent.

    function myextension_civicrm_alterTemplateFile($formName, &$form, $context, &$tplName) {
        $resource = CRM_Core_Resources::singleton();
        if ($formName=='theFormToEdit') {
            $resource->addScriptFile('com.example.myextension', 'js/mychanges.js');
  5. Install and enable your extension.
  • As I understand it, this will work for an Angular form when 'theFormToEdit' is 'Civi\Angular\Page\Main', but you'll end up with the resource being added to all angular forms (which may or may not be what you want). Apr 5, 2017 at 7:44
  • I think the angularModules hook is new in the docs since I wrote this. It looks like a good alternative to my solution that would fix the issues you bring up. docs.civicrm.org/dev/en/master/hooks/… Apr 5, 2017 at 20:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.