Back

The TiQ interface was written for developers and marketers alike and therefore it does not require JavaScript knowledge to use. However, it is important to understand that the selections we make in the interface are eventually transformed into JavaScript code that runs and evaluates on your website. One key example of this is the conditions utilized in Load Rules and Extensions. Understanding the JavaScript code that is generated based on the selections made in the interface can help prevent errors and improve the efficacy of your business logic.

You can see that the conditions selected in the UI and its corresponding JavaScript code below. Notice how the order of the conditions matters.

Condition in the Tealium UI:

conditions.png

 

Corresponding JavaScript Code:

((typeof b['event_name'] != 'undefined' && b['event_name'].toString().toLowerCase().indexOf('add to cart'.toLowerCase()) > -1) || 
(typeof b['event_type'] != 'undefined' && /cart$/i.test(b['event_type'])))

The order of the conditions is critical for the extension or load rule to behave as expected. If the "is defined" check for event_name was placed after the content check for event_name, the code would exit on an error with the condition for event_type not evaluated. This would mean that a potentially valid condition would be missed. 

It is best practice to always add the is defined condition in conjunction with other conditional options. This helps prevent any JavaScript errors and ensures the load rule works as intended.

Generated JavaScript Code for Conditions:

In the table below, you can see the generated JavaScript code for each condition. In all of these examples, {{VALUE}} represents the value from the text field in the extension or the load rule. The variables dom.title is used for strings, cart_total_items and va.badges.42 are used for operators relevant to number and badges respectively. 

Condition JavaScript code generated
contains
(b['dom.title'].toString().indexOf('{{VALUE}}') > - 1)

contains

(ignore case)

(b['dom.title'].toString().toLowerCase().indexOf('{{VALUE}}'.toLowerCase()) > - 1)    
is defined
(typeof b['dom.title'] != 'undefined') 
does not contain
(b['dom.title'].toString().indexOf('{{VALUE}}') < 0) 
does not contain (ignore case)
(b['dom.title'].toString().toLowerCase().indexOf('{{VALUE}}'.toLowerCase()) < 0)   
does not end with
(!/{{VALUE}}$/.test(b['dom.title']))
does not end with (ignore case)
(!/{{VALUE}}$/i.test(b['dom.title']))
does not equal
(b['dom.title'] != '{{VALUE}}')
does not equal (ignore case)
(b['dom.title'].toString().toLowerCase() != '{{VALUE}}'.toLowerCase())
does not start with
(!/^{{VALUE}}/.test(b['dom.title']))
does not start with (ignore case)
(!/^{{VALUE}}/i.test(b['dom.title']))
ends with
(/{{VALUE}}$/.test(b['dom.title']))

ends with

(ignore case)

(/{{VALUE}}$/i.test(b['dom.title']))
equals
(b['dom.title'] == '{{VALUE}}')  

equals

(ignore case)

(b['dom.title'].toString().toLowerCase() == '{{VALUE}}'.toLowerCase())
greater than
(parseFloat(b['cart_total_items']) > parseFloat({{VALUE}}))
greater than or equal to
(parseFloat(b['cart_total_items']) >= parseFloat({{VALUE}}))
is badge assigned
(typeof b['va.badges.42'] != 'undefined')
is badge not assigned
(typeof b['va.badges.42'] == 'undefined')   
less than
(parseFloat(b['cart_total_items']) < parseFloat({{VALUE}}))
less than or equal
(parseFloat(b['cart_total_items']) <= parseFloat({{VALUE}}))  
is not defined
(typeof b['dom.title'] == 'undefined') 
is not populated
(typeof b['dom.title'] != 'undefined' && b['dom.title'] == '')  
is populated
(typeof b['dom.title'] != 'undefined' && b['dom.title'] != '')  
regular expression
(/{{VALUE}}/.test(b['dom.title']))  
starts with
(/^{{VALUE}}/.test(b['dom.title'])) 
starts with (ignore case)
(/^{{VALUE}}/i.test(b['dom.title']))