Forum Moderators: open
I'm using an ajax based calendar (qcalendar) which displays a link inside days that have events. When clicking on one of these events i use jquery to dynamically create a table. This is the link:
1
When clicked it uses the following js included in the header.
jQuery(document).ready(function(){
$('.calendarLink').click(function(ev) {
var prefix = 'date_';
var date = this.id.substring();
$.ajax({
type: "POST",
url: "calendar/script.php",
data: "date="+date,
success: function(msg){
$('#result').html(msg);
}
});
});
});
So this works fine when I'm on the month that loaded by default. (The current month) However, after moving to the next month (using XMLHttpRequest) the link is no longer active when being clicked.
My though is that the jquery needs to be re-instantiated (if that's the right word) because the page hasn't reloaded...but I could be wrong.
Any thoughts?
Cheers.
The issue was, of course, that when making an ajax call to update the calendar to the next month, the DOM is not reloaded, so another ajax call from within the newly generated html doesn't work.
Simple work around was to eliminate the use of jquery's (document).ready(function() and simply call a function by adding an onclick event to the newly generated html.
html onclick event: onclick="getValue(this)" --passes newly generated id
js function: function getValue(control)
{
var date = (control.id);
// do your ajax call
}