val
Purpose: Defines the val element, used to submit information in the business event. |
Description
The <val>
element defines data to submit within the business event. Each occurrence of val in the event specifies a field of the business event.
If the <val> element is a child of <trigger>, it can access also to the DOM event matched by the trigger.
Parent Element
Attributes
Name | Mandatory | Type | Description |
---|---|---|---|
name | yes | string |
Name of the value in the generated business event. Must be unique inside the <event> parent. If an <event> element contains multiple values, they must all have different names across this <event> element. |
value | no | JavaScript code | Specifies the value to associate with the ‘name’ in the field of the generated event. Can be any JavaScript code which returns a serializable object. |
Examples
Searched String
The following example adds a value named "searchString" when "SearchEvent" is generated and sent to the Frontend Server. The value is the string entered in the textbox for search.
<event id="SearchEvent" name="Search">
<trigger name="GoSearchClick" element="td#gobutton input" action="click" url=" " count="1"/>
<val name="searchString" value="$('input.searchfield:text').val();"/>
</event>
The following output is an example of SearchEvent submitted to the Frontend Server if the visitor enters "my search string" in the search box and clicks on the search button. The "EventName" parameter is the "name" attribute of the <event> element, and the <val> element adds a "searchString" parameter to the "data" field. The additional fields are generated automatically by the DSL code:
{
"data":{
"searchString":"my search string"
},
"eventType":"BUSINESS",
"eventName":"Search",
"eventID":"D88B2FF5A9C24095837CF105FB6D5CF9",
"pageID":"A9D1E9265D444351876C13D6C5FA5FAD",
"timestamp":1309962580226,
"globalVisitID":"7E67BA9701124F738CAC80DDFEA1D705",
"visitID":"4608DD210B034AC18C65C2C2275CD8B6",
"userID":"",
"url":"http://www.MySite.com/site/",
"category":""
}
Use of the Trigger's DOM Event
Let's consider tracking the addToCart event, and including information about the product that was added: name, model, and price. Simple tracking by clicking on the "add to cart" button does not provide information about which button was clicked and which product was added to the cart. To get this information, you need to use the DOM event object: event.target identifies the clicked button which can provide information related to the product:
<event id="AddToCartEvent" name="AddToCart">
<trigger name="AddToCartTrigger" element="div.info-side img.bdt-addToCart" action="click" url="http://www.MySite.com/*"count="1">
<val name="productName"value="$(event.target).parents('div.hproduct').find('h3.name').text()"/>
<val name="productModel" value="$(event.target).parents('div.hproduct').find('span.model').text()"/>
<val name="productPrice" value="$(event.target).parents('div.hproduct').find('h4.price').text().replace('Sale:', )"/>
</trigger>
</event>