Answers.Body: <p>Well, a <code>&lt;script&gt;</code> tag is technically html, so... yes.</p>
  <p>That said, if you're used to using js or jQuery to tweak the contents or behavior of an html form, it's probably not going to work the way you're used to. AngularJS has a continuous digest cycle which is constantly refreshing the contents of the page, so any alterations you make (e.g. <code>$('#some-form-element').hide()</code>) will be immediately undone in the next digest cycle.</p>
  <p>Instead of injecting javascript, I would recommend defining a new angular module that contains the special behavior you want, and then edit your <code>.aff.json</code> file to <code>require</code> that module, which will automatically load all the scripts you've defined as part of that module and make their directives/services available on your form.</p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T04:05:34.837Z
Answers.Text: Thank you! I really appreciate you taking the time to explain more. Will be exploring this!
Answers.UserDisplayName: darkmode
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T04:09:44.560Z
Answers.Text: I will also check out angular modules. Thanks!
Answers.UserDisplayName: darkmode
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T19:49:17.420Z
Answers.Text: @coleman - what if I'm trying to alter a core afform? Is there any way to get a core form to require a custom angular module? Specifically, I'm trying to write an extension that allows me to select a particular theme for a given public afform page. But I need to inject a field (and save the selection) to do so.
Answers.UserDisplayName: Jamie
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T23:45:06.227Z
Answers.Text: I think the original idea is that you'd modify core afforms by overriding them with a local copy. Clicking the `Edit` button and saving the form will save a local copy that overrides the core form.
Answers.UserDisplayName: Coleman
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-18T13:16:21.300Z
Answers.Text: I figured out a way to implement this answer with a core form without making a local copy: https://civicrm.stackexchange.com/a/48610/409
Answers.UserDisplayName: Jamie
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T00:58:22.970Z
Answers.LastActivityDate: 2024-09-11T00:58:22.970Z
Answers.UserDisplayName: Coleman
Answers.Body: <p>You can but do it the normal way in the alterangular hook, not inserting js code directly into the html.</p>
  <p>Old but probably still working example: <a href="https://civicrm.stackexchange.com/a/31264/181">https://civicrm.stackexchange.com/a/31264/181</a></p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T01:01:43.023Z
Answers.Text: Or do what coleman says since he's more up to date with this.
Answers.UserDisplayName: Demerit
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T04:08:15.140Z
Answers.Text: Thank you as well! Yes I was planning to do it in alterAngular hook. Was planning to identify certain conditions in the form to check if I should add the scripts. Thank you for your example as well! will definitely help!
Answers.UserDisplayName: darkmode
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T11:51:02.747Z
Answers.Text: I think the hook sits behind a cache so you can't count on it being fired every time the angular page loads. So using CRM_Core_Resources directly probably won't work.
Answers.UserDisplayName: Coleman
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-14T13:59:37.557Z
Answers.Text: @Coleman, thank you for that feedback!
Answers.UserDisplayName: darkmode
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-09-11T01:00:52.710Z
Answers.LastActivityDate: 2024-09-11T01:00:52.710Z
Answers.UserDisplayName: Demerit
Body: <p>In alterAngular, we could alterHTML.</p>
  <p>Just wondering if we can embed or add javascript using alterAngular. Just not sure how to properly do it. Can it be done with alterHtml, pq($doc)-&gt;append() or something like that.</p>
  <p>It seems to be more efficient if I want to add some scripts in afform only.</p>
  
Tags: <formbuilder>
Title: FormBuilder: alterAngular embed javascript
ThreadText: # FormBuilder: alterAngular embed javascript
  
  (Asked by: username_0 on 2024-09-11)
  
  In alterAngular, we could alterHTML.
  
  Just wondering if we can embed or add javascript using alterAngular. Just not sure how to properly do it. Can it be done with alterHtml, pq($doc)->append() or something like that.
  
  It seems to be more efficient if I want to add some scripts in afform only.
  
  **Tags:** formbuilder
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_1 on 2024-09-11. Score: 2
  
  Well, a `<script>` tag is technically html, so... yes.
  
  That said, if you're used to using js or jQuery to tweak the contents or behavior of an html form, it's probably not going to work the way you're used to. AngularJS has a continuous digest cycle which is constantly refreshing the contents of the page, so any alterations you make (e.g. `$('#some-form-element').hide()`) will be immediately undone in the next digest cycle.
  
  Instead of injecting javascript, I would recommend defining a new angular module that contains the special behavior you want, and then edit your `.aff.json` file to `require` that module, which will automatically load all the scripts you've defined as part of that module and make their directives/services available on your form.
  
  > **Comments:**
  > **username_0**: Thank you! I really appreciate you taking the time to explain more. Will be exploring this!  
  > **username_0**: I will also check out angular modules. Thanks!  
  > **username_2**: @username_1 - what if I'm trying to alter a core afform? Is there any way to get a core form to require a custom angular module? Specifically, I'm trying to write an extension that allows me to select a particular theme for a given public afform page. But I need to inject a field (and save the selection) to do so.  
  > **username_1**: I think the original idea is that you'd modify core afforms by overriding them with a local copy. Clicking the `Edit` button and saving the form will save a local copy that overrides the core form.  
  > **username_2**: I figured out a way to implement this answer with a core form without making a local copy: https://civicrm.stackexchange.com/a/48610/409  
  
  ---
  
  ### Answer by username_3 on 2024-09-11. Score: 1
  
  You can but do it the normal way in the alterangular hook, not inserting js code directly into the html.
  
  Old but probably still working example: <https://civicrm.stackexchange.com/a/31264/181>
  
  > **Comments:**
  > **username_3**: Or do what username_1 says since he's more up to date with this.  
  > **username_0**: Thank you as well! Yes I was planning to do it in alterAngular hook. Was planning to identify certain conditions in the form to check if I should add the scripts. Thank you for your example as well! will definitely help!  
  > **username_1**: I think the hook sits behind a cache so you can't count on it being fired every time the angular page loads. So using CRM_Core_Resources directly probably won't work.  
  > **username_0**: @username_1, thank you for that feedback!  
  
  ---
  
  