How to set a Data element just before sending the event?

[sirisha_ganti]

I have a requirement where I need to set the Data element to a specific value based on the click action in the client. I tried using the custom code option in the Data element itself. I see the JS running correctly but the data element itself is not set i.e, I don't see the value reflected in the xdm object in the events array in the preview object (events[0].xdm._myobject.customsubobject.mydataelement). mydataelement is not set. The extension used is "Adobe Experience Platform Web SDK". Is there a way to run custom code to set the data elements on an event before sending it?

[Anil_Umachigi]

@sirisha_ganti  There are couple of approaches you could take based on what data you are populating, since you mentioned "click" event you can explore the option of adding the desired xdm field within "onBeforeLoadEvent" custom code within the extension config. 

Something like this 

[yuhuisg]

What is the source of the data element that you want to set? Depending on what this source is, there could be several ways to set your data element properly.

With a click event, the most common use case is to track the the link's URL or the link's name/label. The good news is that both of these can be obtained without needing a separate data element. In your XDM object, at your "mydataelement" field, you can specify %this.href% if you want to track the link's URL, or %this.@cleanText% if you want to track the link's name/label. These are shortcuts that can be used with the Core > Click event.

[sirisha_ganti]

I am not looking at the href. I want to capture the click on the href. If the button(link) has been clicked, then capture that it has been clicked on the Data element.

[yuhuisg]

With the Core > Click event, this.href will return the link URL of the clicked link.

Example, given this code:

<a href="https://www.website.com/link.html">Click me!</a>

Then when I click that "Click me!" link, the Core > Click event will set this.href to "https://www.website.com/link.html".

---

@sirisha_ganti wrote:

If the button(link) has been clicked, then capture that it has been clicked on the Data element.

---

This statement is confusing. It sounds like you want the data element to return a counter, e.g. "1", or some kind of state value, e.g. "clicked", when the link has been clicked. Giving an example of your desired output might help to illustrate what you mean here.

[ranjithd · Accepted solution]

Yes, you may use the Adobe Experience Platform Web SDK to set the value of a data element on an event before transmitting it. To set the value of an event object's data element, use the setEventProperty method.

Here's an example of how to set the value of a data element on the event object named mydataelement:

// Define a function to set the value of the data element

function setMyDataElement(event) {

  var myDataValue = "my custom value";   // Add your custom code here to set the value of the data element

  event.xdm._myobject.customsubobject.mydataelement = myDataValue; // Set the value of the data element on the event object

}

// Add a listener to the "click" event

document.addEventListener("click", function() {

  var event = new window.adobeDataLayer.push({}); // Create an event object

  setMyDataElement(event); // Call the setMyDataElement function to set the value of the data element

  event.type = "myEventType"; // Set the event type to "myEventType"

  window.adobeDataLayer.push(event); // Send the event

});

When the "click" event is triggered in this example, the setMyDataElement method is invoked. You can add custom code to the function to set the value of the data element. The setEventProperty function is then used to set the value of the event object's data element. Finally, the event type is set to "myEventType" and the event is sent through the push function.

You may modify this code to set the value of a certain data element and trigger an event based on a user action.