I am trying to call Ajax with jQuery and need to pass a variable that is set with PHP on the page load, to two separate functions to either move my calendar forward or backwards by the months.
var ajax_load = "Loading...",
loadUrl = "calendar_backend.php",
month = parseInt(<?php echo $month ?>);
console.log(month);
month = <?php echo $month ?>;
$("#calendar_box").on("click",'#next_month',function(){
console.log(month);
$("#calendar")
.html(ajax_load)
.load(loadUrl, "month=" + month + "&go=next");
var month = ++month;
console.log(month);
});
$("#calendar_box").on("click",'#previous_month',function(){
$("#calendar")
.html(ajax_load)
.load(loadUrl, "month" + month + "&go=previous");
var month = --month;
});
I have the console calls in there to try to debug this and I get 4 from the first .log() undefined from the second one, and NaN from the third. From those three I can see that the variable is not getting passed into the .on() handler function.
The calender generating page is included_once on the index page and then the AJAX would be used to regenerate the correct data for the month. I need the month passed in the get string to know how far from the current month i need to offset.
Thanks for the help!!
Simply don't use the var
keyword inside the function body. var
will instanciate a new variable inside the success function
. And you using the decress/incresse operator wrong, its only month++;
and month--;
var ajax_load = "Loading...",
loadUrl = "calendar_backend.php",
month = parseInt(<?php echo $month ?>);
console.log(month);
month = <?php echo $month ?>;
$("#calendar_box").on("click",'#next_month',function(){
console.log(month);
$("#calendar")
.html(ajax_load)
.load(loadUrl, "month=" + month + "&go=next");
month++; // Removed var and incressing
console.log(month);
});
$("#calendar_box").on("click",'#previous_month',function(){
$("#calendar")
.html(ajax_load)
.load(loadUrl, "month" + month + "&go=previous");
month--; // Removed var and decressing
});
function next_month(month){
console.log(month);
$("#calendar").html(ajax_load).load(loadUrl, "month=" + month + "&go=next");month++;console.log(month);}
$("#calendar_box").on("click",'#next_month',function(){next_month(month);});)
But when I click again its still using the original value for month, and is not updating - Rockstar04 2012-04-05 20:59
var
keyword in the functions. Also, when you use the increment/decrement operators, you should not also use an assignment; just++month
or--month
by itself is all you need - Pointy 2012-04-05 20:25