Expand my Community achievements bar.

SOLVED

Element Exists and Text Changes

Avatar

Level 2

I thought I could build two different event based rules for the same element with a secondary condition being the differentiation between the two so they both would fire. One rule for  div.dxp-modal-window-content>h2 where textContent matches 'expiration warning' and the second rule being div.dxp-modal-window-content>h2 where textContent matches 'session expired'. But its not working only, the first rule fires. I am assuming this does not work because the div.dxp-modal-window-content>h2 is added to the DOM once and its merely the textContent that is changing.

Anyway to build a CSS rule based on the text changing after an element is added to the DOM? I know I could use a Direct Call rule but we only have releases 4 times per year and I don't want to have to wait that long.

1 Accepted Solution

Avatar

Correct answer by
Level 10

Hi Jeff,

I am not very sure if this will work but an alternative way of doing this is to create a Data Element of Type CSS Selector. In the CSS Selector Chain, point to your element    div.dxp-modal-window-content>h2, and for get the value of, select "text".

Next, in the Event Based Rule, choose Event Type of dataelementchanged, and then select your Data Element in the dropdown and then in criteria for the rule Please select criteria as  'Data Element value'  and then select your data element and type the value of it as 'session expired' . Hence the rule will only trigger if the data element mapped to div.dxp-modal-window-content>h2 has value 'session expired'.

Also, Can you please provide the URL of test page , so that we can test it from our end ?

Regards

Parit Mittal

View solution in original post

9 Replies

Avatar

Level 10

Hi,

Which condition are you using in your event based rules currently?

Thanks,
Jantzen

Avatar

Level 2

Attached screen shots

Rule 1 Element exists – div.dxp-modal-window-content>h2 and textContent contains session is about to expire

Rule 2 Element exists – div.dxp-modal-window-content>h2 and textContent contains Start over

Thnx

Jeff

Site Optimization, Analytics and Reporting Principal

Avatar

Level 10

Thanks for providing the additional information.

The second rule would need to fire using a different event handler. I believe the Element exists handler is only fired once. You could try using the Enters viewport or you could always write your own if the built-in handlers aren't meeting your needs.

Thanks,
Jantzen

Avatar

Level 2

Thank you but unfortunately the modal is launched with all the elements and for Rule 2 the only thing changing is the textContent. Not sure it’s possible to write an event handler for textContent attribute

Thnx

Jeff

Site Optimization, Analytics and Reporting Principal

Avatar

Level 10

ParitMittal​ - Do you have any ideas that might help here?

Avatar

Correct answer by
Level 10

Hi Jeff,

I am not very sure if this will work but an alternative way of doing this is to create a Data Element of Type CSS Selector. In the CSS Selector Chain, point to your element    div.dxp-modal-window-content>h2, and for get the value of, select "text".

Next, in the Event Based Rule, choose Event Type of dataelementchanged, and then select your Data Element in the dropdown and then in criteria for the rule Please select criteria as  'Data Element value'  and then select your data element and type the value of it as 'session expired' . Hence the rule will only trigger if the data element mapped to div.dxp-modal-window-content>h2 has value 'session expired'.

Also, Can you please provide the URL of test page , so that we can test it from our end ?

Regards

Parit Mittal

Avatar

Level 2

That sounds like a very plausible solution Parit and I hadn’t even thought about using a CSS Data Element. I will give this a try and let you know. Here is the production site. And the pages we host are the shopping and booking pages and that’s where you will see the session timeout warning and expiration; https://dx.flights.kulula.com/dx/MNDX/#/home

Thnx

Jeff

Site Optimization, Analytics and Reporting Principal

Avatar

Level 10

Hi Jeff,

Any updates here? Did Parit's suggestion solve the issue? If so, I'd like to get his answer marked as correct in case others face a similar issue.

Thanks,
Jantzen

Avatar

Level 2

My apologies I thought I had indicated the suggestion worked to use a CSS data element.

Thnx

Jeff

Site Optimization, Analytics and Reporting Principal