next and previous function not defined error am trying to fix it but couldn't please

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • shilpaathawale
    New Member
    • Oct 2018
    • 1
    #1

    next and previous function not defined error am trying to fix it but couldn't please

    Code:
    <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" media="screen" href="https://bytes.com/calender.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <script src="https://bytes.com/calender.js" type="text/javascript"></script> </head> <body onload="initialise();"> <button onclick="previous();"> <i class="fa fa-angle-down"></i></button> <span id="thismonth"></span> <button onclick="next();"> <i class="fa fa-angle-up"></i></button> </body> <script>
var months = ["January","February","March","April","May","June","July","August","September","October","November","December"];
var currentMonth=0;
var currentYear=0;
var d= new Date();
currentMonth=d.getMonth();
currentYear=d.getFullYear();
var firstdate=months[currentMonth]+ " " + 1 + " " + currentYear;
function initialise(){
        document.getElementById("thismonth").innerHTML=months[currentMonth]+ "  " + currentYear;
function previous(){
    if(currentMonth===0){
        
        currentMonth=11;
        currentYear=currentYear-1;
    }
    else if(currentMonth>0){
        currentMonth=currentMonth-1;
 }
 document.getElementById("thismonth").innerHTML=months[currentMonth]+ "  " + currentYear;
}


function next(){
    if(currentMonth<11){
        
        currentMonth=currentMonth+1;
    }
    else if(currentMonth === 11){
        currentMonth=0;
        currentYear=currentYear+1;     
    }
    document.getElementById("thismonth").innerHTML=months[currentMonth]+ " " +currentYear;
}
}
</script> </html>
    Last edited by gits; Oct 19 '18, 08:24 AM. Reason: added code tags
    Tags: None
    • gits
      Recognized Expert Moderator Expert
      • May 2007
      • 5388
      #2
      have a close look at what you did construct. you are declaring the functions next and previous in the scope of the function initialise - thus they are not available in the window scope from where you want to call them in your onclick-handlers.

      a hacky and not the preferred way to fix that could be to just add something like this:

      Code:
      window.previous = function previous() { ...
      which would bind the function to the window scope with the name previous so it could be called as you did.

      The better way would be to assign the handler during the initialise-operation (instead of polluting the window scope like in the above example). There are different ways to do it like:

      Code:
      node.onclick = function() { //code here };
      or:

      Code:
      node.addEventListener('click', function() { //code here }, true || false);
      instead of writing the functions like in that pseudo-code above it would be more elegant to declare them before and assign/pass them by name only.
      Last edited by gits; Oct 22 '18, 03:01 PM.

        Comment

        Previous template Next
        Working...