LeadsHook is highly suitable for scripting via JavaScript. That includes JQuery and almost every other JS library.

Here are some tips to ensure your scripts work without any issues.

Loading & Firing of Node Level Scripts

If you set your script to fire on enter of a node without a delay, the script will fire before the node loads. This can cause issues because the data is not available for the script to use. This is why you might want to add a delay and allow the node to fully load. This ensures the visual elements of the node are prioritized and also the data required by your script is available. The script below fires 500ms after node is loaded. You can adjust it accordingly by editing ‘500’ to some other number. E.g. 1000ms = 1 second.

<script>
  var interval = setInterval(nodeLoaded, 500)
  // Check if node is loaded
  function nodeLoaded() {
  	var node = document.querySelector('.node-well')
    if (node){
      	// ----Your Script Goes Here-----
      	// Clear Interval Function when node is loaded
    	clearInterval(interval)
    }
  }
</script>

Alternatively set your script to fire on exit of a node.

Assigning an id to an element (so you can access it in JS)

Trying to assign an id to an element with standard JS or even JQuery will fail, because we use Angular for our front end. So naturally you need to assign an id with angular too. Then you can access the element any way you like.

angular.element(document.getElementsByClassName("next-btn")).attr('id', '123');

This assigns the id “123” to the next button of a given node.

Other handy scripts (specific to LH) can be found in the “Functions” section of the Admin menu

For example updating a custom field via JS

And getting and setting cookies.

Cant import scripts in the Custom Page Node

Usually a developer will use <script src=”URL…> in their code.

For example:

<script type="module" src="node_modules/spin.js/spin.js"></script>

Currently this doesn’t work in LeadsHook when using the custom page node.

Instead we need to load the URL to the script in your browser window.

And then copy/paste it into a <script>[paste code here]</script> section.

Note that its important where you place your script too. So if it’s not working initially, try moving the <script> section lower so that the UI elements load first. Then the script is will run after this.

Support fully included with your subscription

If you encounter any strange issues with your scripts simply send an email through to us at: help@www.www.leadshook.com