Highlighted

using javascript extension to add jquery code

Rookie Contributor

I have written the following jquery code into a javascript extension and scoped it to DOM ready, but it doesnot trigger, however its working in the console.Do we need to write it using js coding?

 


jQuery('.aa-upsell-details.fare-bundle1').click(function () {
console.log("abcd");//does not print in console
b.temp_prevsel = jQuery('.fare-name').text();
b.temp_cursel = jQuery('[fare=Bundle1] .upsellSelector').text();
b.temp_pricediff = jQuery(".aa-upsell-details.fare-bundle1").text().match(/\d+/);
console.log(b.temp_prevsel);
console.log(b.temp_pricediff);
});

jQuery('.aa-upsell-details.fare-bundle2').click(function () {
b.temp_prevsel = jQuery('.fare-name').text();
b.temp_cursel = jQuery('[fare=Bundle2] .upsellSelector').text();
b.temp_pricediff = jQuery('.aa-upsell-details.fare-bundle2').text().match(/\d+/);
console.log(b.temp_prevsel);
console.log(b.temp_pricediff);
});

jQuery('.aa-upsell-details.fare-first-special').click(function () {
b.temp_prevsel = jQuery('.fare-name').text();
b.temp_cursel = jQuery('[fare=FirstSpecial] .upsellSelector').text();
b.temp_pricediff = jQuery('.aa-upsell-details.fare-first-special').text().match(/\d+/) ;
console.log(b.temp_prevsel);
console.log(b.temp_pricediff);
});

jQuery('.aa-upsell-details.fare-first-flexible').click(function () {
b.temp_prevsel = jQuery('.fare-name').text();
b.temp_cursel = jQuery('[fare=FirstFlexible] .upsellSelector').text();
b.temp_pricediff = jQuery('.aa-upsell-details.fare-first-flexible').text().match(/\d+/) ;
console.log(b.temp_prevsel);
console.log(b.temp_pricediff);
});

 

I have defined the temp variables in data layer. I want to store these values in the temp variables and then pass it to a site catalyst variable after concatenation(evar XX= temp_prevsel+temp_cursel+temp_pricediff).

1 REPLY 1
Highlighted

using javascript extension to add jquery code

Employee Emeritus

Hi @vidya2,

Do you have an example URL where this code should be executing?  What version of jQuery are you using?  Are the elements you are selecting via jQuery added in the DOM dynamically?  If so, the timing of when these execute may be the issue hence the reason why you are seeing it work in your console.

You can try to use the .live or .on jQuery methods to look for future elements depending on the version on jQuery you are using.