I have come up with a script that I recently created.
<script>
$(document).ready(function(){
$('a').data('loop',true);
$('body').on('click', 'a', function(event){
console.log($(this).data('loop'));
if ($(this).data('loop') == 'true') {
console.log('hit');
event.preventDefault();
caller = $(this);
$(this).data('loop',false);
var linkref = $(this).attr('href');
var linkpos = $(this).offset();
var screenwidth = $(window).width();
var json_data = JSON.stringify({linkref: linkref, linkpos: linkpos, screenwidth: screenwidth});
$.ajax({
url: "content/submitcontenthandler?handler=core/_dashboard&method=tracking_ping",
method: "POST",
data: "json=" + json_data,
complete: function (jqXHR, status) {
console.log(status);
console.log(caller);
$(caller).click();
}
});
} else {
console.log(event.isDefaultPrevented());
console.log('miss');
$(this).data('loop',true);
}
});
});
</script>
The script works perfectly and provides me with the information I need. However...
When I click on a link, it sends the details via Ajax as expected, but the link does not redirect to its destination page. This seems to be happening because of the event.preventDefault() line.
If I remove the event.preventDefault(); line, then everything works as intended.
It appears that event.preventDefault is being triggered even during the second call, causing the normal action of the event not to occur.
Apologies if this explanation is a bit complex. I am also trying to figure out what could be causing this issue. Is it a bug or something specific in my code?
To help understand the situation better, I have created a jsfiddle: https://jsfiddle.net/atg5m6ym/2001/