CODEWITHSUNDEEP
javascript
Sovon Mainul
Sovon Mainul

Reputation: 29

element.style.display='none' is not working

<html>
<head>
<script type="text/javascript">

function nameofmonth(month)
 {  
 var monthname=new  Array("January","February","March","April","May","June","July","August","September","October","November","December")
  return monthname[month]
}  
 function monthdays(month,year)
 {
  var daysofmonth=new Array(31,28,31,30,31,30,31,31,30,31,30,31)
  if(year%4==0)
  daysofmonth[1]=29  
  return daysofmonth[month]   
  }
 function close(){

 document.getElementById("container").style.display='none'
 }

 function table()
  {
   var now=new Date()
   var hour=now.getHours()
   var minute=now.getMinutes()
   var second=now.getSeconds()
   var date=now.getDate()
   var month=now.getMonth() 
   var year=now.getFullYear()
   now.setFullYear(year,month,1)
   var firstday=now.getDay()
   var monthname=nameofmonth(month)
   var daysofmonth=monthdays(month,year)
    if(firstday>0)
      var k=-(firstday-1)
    else
      k=1
   var table="<table border=5 cellspacing=3cellpadding=8>"
   table +="<tr><th colspan=7>"+monthname + date+"th</th> <td  style='cursor:pointer' onclick='close()'>[close]</td></tr>"
   table +="<tr><th>sun</th><th>mon</th><th>tue</><th>wed</th><th>thu</th><th>fri</><th>sat</th></tr>"
   for(var i=0;i<5;i++)
    {
     table+="<tr>"
     for(var j=0;j<7;j++)
      {
        if(k<=daysofmonth && k>0)
          { if(k==date)
             table+='<td id="clock" bgcolor="aqua">'+k+'</td>'
          else
           table+='<td style="cursor:pointer">'+k+'</td>'
           k=parseInt(k)

         }
      else
         table+="<td></td>"
         k++
       }
  table+="</tr>"
  document.getElementById("calender").innerHTML=table  
}
}


</script>
</head>
<body>
<input type="text" onclick="table()"/>
<table id="container"><tr><td id="calender"></td></tr></table>

</body>
</html>

This is my code of a calender which appears after clicking on a textbox.Here is a close cell in table.when close is clicked the close() function will called and calender will disappear.But this is not happening.why?please help me...thanks in advance..

Upvotes: 0

Views: 9057

Answers (3)

mplungjan
mplungjan

Reputation: 177692

Here is a DEMO of how it could work more elegantly

<input type="text" id="cal" onclick="table(this)"/>
<div id="container">
    <div id="calender"></div>
</div>    

function nameofmonth(month)  {  
  return ["January","February","March","April","May","June","July","August","September","October","November","December"][month];
}  

function closeIt(){
  document.getElementById("container").style.display='none';
}

function table(cal) {
   var now=new Date(),
      hour=now.getHours(),
      minute=now.getMinutes(),
      second=now.getSeconds(),
      date=now.getDate(),
      month=now.getMonth(),
      year=now.getFullYear();
   now.setFullYear(year,month,1);
   var firstday=now.getDay(),
       monthname=nameofmonth(month);
   now.setFullYear(year,now.getMonth()+1,0); // last of this month
   var daysofmonth=now.getDate();
   var k=(firstday>0)?-(firstday-1):1;
   var table="<table border=5 cellspacing=3 cellpadding=8>"
   table +="<tr><th colspan=7>"+monthname + date+"th</th> <td  style='cursor:pointer' onclick='closeIt()'>[close]</td></tr>"
   table +="<tr><th>sun</th><th>mon</th><th>tue</><th>wed</th><th>thu</th><th>fri</><th>sat</th></tr>";
   for(var i=0;i<5;i++) {
     table+="<tr>";
     for (var j=0;j<7;j++) {
       if (k<=daysofmonth && k>0) {
         if (k==date) table+='<td id="clock" bgcolor="aqua">'+k+'</td>';
         else table+='<td style="cursor:pointer" onclick="document.getElementById(\''+cal.id+'\').value=\''+(month+1)+'/'+k+'/'+year+'\'">'+k+'</td>';
       }
       else table+="<td></td>";
       k++
     }
     table+="</tr>";
    }     
    document.getElementById("calender").innerHTML=table+"</table>";  

}

Upvotes: 0

david
david

Reputation: 4278

close is a javascript Keyword you should use another word other than close for your function name for more info check out JavaScript Reserved Words

Upvotes: 1

diewie
diewie

Reputation: 764

This has nothing to do with the semicolons. Those are mostly optional and not needed in this example. The function close() is reserved and cannot be called by onclick. Just rename close() to something like closeCalendar() and it should be working fine.

Upvotes: 2

Related Questions