Solved

Help with a JavaScript Popup calendar

Posted on 2004-08-03
7
571 Views
Last Modified: 2008-01-09
I hope this is going to be an easy question.  I have a piece of code that I am using that I downloaded from a site, and I need to change it slightly, it is freeware, and I haven't gotten any feedback from the developer about how to do this.

I need to have the month back work.  It only shows from the current month to the next 12 months.  And I want to go back in time.   I want to be able to select previous months as well.  Can it go back as far as 12 months? and also go forward 12 months?

Here is the code.
/* PopUp Calendar v2.1
© PCI, Inc.,2000 • Freeware
webmaster@personal-connections.com
+1 (925) 955 1624
Permission granted  for unlimited use so far
as the copyright notice above remains intact. */

/* Settings. Please read readme.html file for instructions*/
var ppcDF = "m/d/Y";
var ppcMN = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
var ppcWN = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var ppcER = new Array(4);
ppcER[0] = "Required DHTML functions are not supported in this browser.";
ppcER[1] = "Target form field is not assigned or not accessible.";
ppcER[2] = "Sorry, the chosen date is not acceptable. Please read instructions on the page.";
ppcER[3] = "Unknown error occured while executing this script.";
var ppcUC = false;
 var ppcUX = 4;
 var ppcUY = 4;

/* Do not edit below this line unless you are sure what are you doing! */

var ppcIE=(navigator.appName == "Microsoft Internet Explorer");
var ppcNN=((navigator.appName == "Netscape")&&(document.layers));
var ppcTT="<table width=\"200\" cellspacing=\"1\" cellpadding=\"2\" border=\"1\" bordercolorlight=\"#000000\" bordercolordark=\"#000000\">\n";
var ppcCD=ppcTT;var ppcFT="<font face=\"MS Sans Serif, sans-serif\" size=\"1\" color=\"#000000\">";var ppcFC=true;
var ppcTI=false;var ppcSV=null;var ppcRL=null;var ppcXC=null;var ppcYC=null;
var ppcML=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
var ppcWE=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var ppcNow=new Date();var ppcPtr=new Date();
if (ppcNN) {
 window.captureEvents(Event.RESIZE);
 window.onresize = restoreLayers;
 document.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
 document.onmousedown = recordXY;
 document.onmouseup = confirmXY;}
function restoreLayers(e) {
 if (ppcNN) {
  with (window.document) {
   open("text/html");
   write("<html><head><title>Restoring the layer structure...</title></head>");
   write("<body bgcolor=\"#FFFFFF\" onLoad=\"history.go(-1)\">");
   write("</body></html>");
   close();}}}
function recordXY(e) {
 if (ppcNN) {
  ppcXC = e.x;
  ppcYC = e.y;
  document.routeEvent(e);}}
function confirmXY(e) {
 if (ppcNN) {
  ppcXC = (ppcXC == e.x) ? e.x : null;
  ppcYC = (ppcYC == e.y) ? e.y : null;
  document.routeEvent(e);}}
function getCalendarFor(target,rules) {
 ppcSV = target;
 ppcRL = rules;
 if (ppcFC) {setCalendar();ppcFC = false;}
 if ((ppcSV != null)&&(ppcSV)) {
  if (ppcIE) {
   var obj = document.all['PopUpCalendar'];
   obj.style.left = document.body.scrollLeft+event.clientX;
   obj.style.top  = document.body.scrollTop+event.clientY;
   obj.style.visibility = "visible";}
  else if (ppcNN) {
   var obj = document.layers['PopUpCalendar'];
   obj.left = ppcXC
   obj.top  = ppcYC
   obj.visibility = "show";}
  else {showError(ppcER[0]);}}
 else {showError(ppcER[1]);}}
function switchMonth(param) {
 var tmp = param.split("|");
 setCalendar(tmp[0],tmp[1]);}
function moveMonth(dir) {
 var obj = null;
 var limit = false;
 var tmp,dptrYear,dptrMonth;
 if (ppcIE) {obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {showError(ppcER[0]);}
 if (obj != null) {
  if ((dir.toLowerCase() == "back")&&(obj.selectedIndex > 0)) {obj.selectedIndex--;}
  else if ((dir.toLowerCase() == "forward")&&(obj.selectedIndex < 12)) {obj.selectedIndex++;}
  else {limit = true;}}
 if (!limit) {
  tmp = obj.options[obj.selectedIndex].value.split("|");
  dptrYear  = tmp[0];
  dptrMonth = tmp[1];
  setCalendar(dptrYear,dptrMonth);}
 else {
  if (ppcIE) {
   obj.style.backgroundColor = "#FF0000";
   window.setTimeout("document.ppcMonthList.sItem.style.backgroundColor = '#FFFFFF'",50);}}}
function selectDate(param) {
 var arr   = param.split("|");
 var year  = arr[0];
 var month = arr[1];
 var date  = arr[2];
 var ptr = parseInt(date);
 ppcPtr.setDate(ptr);
 if ((ppcSV != null)&&(ppcSV)) {
  if (validDate(date)) {ppcSV.value = dateFormat(year,month,date);hideCalendar();}
  else {showError(ppcER[2]);if (ppcTI) {clearTimeout(ppcTI);ppcTI = false;}}}
 else {
  showError(ppcER[1]);
  hideCalendar();}}
function setCalendar(year,month) {
 if (year  == null) {year = getFullYear(ppcNow);}
 if (month == null) {month = ppcNow.getMonth();setSelectList(year,month);}
 if (month == 1) {ppcML[1]  = (isLeap(year)) ? 29 : 28;}
 ppcPtr.setYear(year);
 ppcPtr.setMonth(month);
 ppcPtr.setDate(1);
 updateContent();}
function updateContent() {
 generateContent();
 if (ppcIE) {document.all['monthDays'].innerHTML = ppcCD;}
 else if (ppcNN) {
  with (document.layers['PopUpCalendar'].document.layers['monthDays'].document) {
   open("text/html");
   write("<html>\n<head>\n<title>DynDoc</title>\n</head>\n<body bgcolor=\"#FFFFFF\">\n");
   write(ppcCD);
   write("</body>\n</html>");
   close();}}
 else {showError(ppcER[0]);}
 ppcCD = ppcTT;}
function generateContent() {
 var year  = getFullYear(ppcPtr);
 var month = ppcPtr.getMonth();
 var date  = 1;
 var day   = ppcPtr.getDay();
 var len   = ppcML[month];
 var bgr,cnt,tmp = "";
 var j,i = 0;
 for (j = 0; j < 7; ++j) {
  if (date > len) {break;}
  for (i = 0; i < 7; ++i) {
   bgr = ((i == 0)||(i == 6)) ? "#FFFFCC" : "#FFFFFF";
   if (((j == 0)&&(i < day))||(date > len)) {tmp  += makeCell(bgr,year,month,0);}
   else {tmp  += makeCell(bgr,year,month,date);++date;}}
  ppcCD += "<tr align=\"center\">\n" + tmp + "</tr>\n";tmp = "";}
 ppcCD += "</table>\n";}
function makeCell(bgr,year,month,date) {
 var param = "\'"+year+"|"+month+"|"+date+"\'";
 var td1 = "<td width=\"20\" bgcolor=\""+bgr+"\" ";
 var td2 = (ppcIE) ? "</font></span></td>\n" : "</font></a></td>\n";
 var evt = "onMouseOver=\"this.style.backgroundColor=\'#FF0000\'\" onMouseOut=\"this.style.backgroundColor=\'"+bgr+"\'\" onMouseUp=\"selectDate("+param+")\" ";
 var ext = "<span Style=\"cursor: hand\">";
 var lck = "<span Style=\"cursor: default\">";
 var lnk = "<a href=\"javascript:selectDate("+param+")\" onMouseOver=\"window.status=\' \';return true;\">";
 var cellValue = (date != 0) ? date+"" : "&nbsp;";
 if ((ppcNow.getDate() == date)&&(ppcNow.getMonth() == month)&&(getFullYear(ppcNow) == year)) {
  cellValue = "<b>"+cellValue+"</b>";}
 var cellCode = "";
 if (date == 0) {
  if (ppcIE) {cellCode = td1+"Style=\"cursor: default\">"+lck+ppcFT+cellValue+td2;}
  else {cellCode = td1+">"+ppcFT+cellValue+td2;}}
 else {
  if (ppcIE) {cellCode = td1+evt+"Style=\"cursor: hand\">"+ext+ppcFT+cellValue+td2;}
  else {
   if (date < 10) {cellValue = "&nbsp;" + cellValue + "&nbsp;";}
   cellCode = td1+">"+lnk+ppcFT+cellValue+td2;}}
 return cellCode;}
function setSelectList(year,month) {
 var i = 0;
 var obj = null;
 if (ppcIE) {obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {/* NOP */}
 while (i < 13) {
  obj.options[i].value = year + "|" + month;
  obj.options[i].text  = year + " • " + ppcMN[month];
  i++;
  month++;
  if (month == 12) {year++;month = 0;}}}
function hideCalendar() {
 if (ppcIE) {document.all['PopUpCalendar'].style.visibility = "hidden";}
 else if (ppcNN) {document.layers['PopUpCalendar'].visibility = "hide";window.status = " ";}
 else {/* NOP */}
 ppcTI = false;
 setCalendar();
 ppcSV = null;
 if (ppcIE) {var obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {var obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {/* NOP */}
 obj.selectedIndex = 0;}
function showError(message) {
 window.alert("[ PopUp Calendar ]\n\n" + message);}
function isLeap(year) {
 if ((year%400==0)||((year%4==0)&&(year%100!=0))) {return true;}
 else {return false;}}
function getFullYear(obj) {
 if (ppcNN) {return obj.getYear() + 1900;}
 else {return obj.getYear();}}
function validDate(date) {
 var reply = true;
 if (ppcRL == null) {/* NOP */}
 else {
  var arr = ppcRL.split(":");
  var mode = arr[0];
  var arg  = arr[1];
  var key  = arr[2].charAt(0).toLowerCase();
  if (key != "d") {
   var day = ppcPtr.getDay();
   var orn = isEvenOrOdd(date);
   reply = (mode == "[^]") ? !((day == arg)&&((orn == key)||(key == "a"))) : ((day == arg)&&((orn == key)||(key == "a")));}
  else {reply = (mode == "[^]") ? (date != arg) : (date == arg);}}
 return reply;}
function isEvenOrOdd(date) {
 if (date - 21 > 0) {return "e";}
 else if (date - 14 > 0) {return "o";}
 else if (date - 7 > 0) {return "e";}
 else {return "o";}}
function dateFormat(year,month,date) {
 if (ppcDF == null) {ppcDF = "m/d/Y";}
 var day = ppcPtr.getDay();
 var crt = "";
 var str = "";
 var chars = ppcDF.length;
 for (var i = 0; i < chars; ++i) {
  crt = ppcDF.charAt(i);
  switch (crt) {
   case "M": str += ppcMN[month]; break;
   case "m": str += (month<9) ? ("0"+(++month)) : ++month; break;
   case "Y": str += year; break;
   case "y": str += year.substring(2); break;
   case "d": str += ((ppcDF.indexOf("m")!=-1)&&(date<10)) ? ("0"+date) : date; break;
   case "W": str += ppcWN[day]; break;
    default: str += crt;}}
 return unescape(str);}

Thanks
0
Comment
Question by:Meps
7 Comments
 
LVL 2

Expert Comment

by:MGrassman
ID: 11708905
I use a vbScript that will let you go back or forward many years.  Hope it helps.

Place this code in your HTML Document.

------------------------------------------------------------------------------------------
This is the input box that you would use along with the image that opens
the calander page.
------------------------------------------------------------------------------------------

<input type="text" name="StartDate" size="10" language="vbscript" onblur="ValidDate StartDate,StartDate.value,4" tabindex="1" >
<img SRC="images/Calender5.gif" onclick="StartDate.value = doOpen" language="vbscript" size="5" Title="Start Date Calendar" align="absbottom" WIDTH="31" HEIGHT="25">


------------------------------------------------------------------------------------------
This script goes in you HTML HEAD Section
------------------------------------------------------------------------------------------
<script language=javascript>

function ValidDate(dateobj,dateStr,yrPos) {
// Checks for the following valid date formats:
// MM/DD/YY   MM/DD/YYYY   MM-DD-YY   MM-DD-YYYY
// Also separates date into month, day, and year variables
if (dateStr=="") {
      return}
var datePat = /^(\d{1,2})(\/|-)(\d{1,2})\2(\d{2}|\d{4})$/;

// To require a 4 digit year entry, use this line instead:
// var datePat = /^(\d{1,2})(\/|-)(\d{1,2})\2(\d{4})$/;

var matchArray = dateStr.match(datePat); // is the format ok?
if (matchArray == null) {
alert( dateStr + " : Date is not in a valid format. (MM/DD/YYYY)")
dateobj.value = "";
dateobj.focus();
return false;
}
month = matchArray[1]; // parse date into variables
day = matchArray[3];
year = matchArray[4];
if (month < 1 || month > 12) { // check month range
alert("Month must be between 1 and 12.");
dateobj.value = "";
dateobj.focus();
return false;
}
if (day < 1 || day > 31) {
alert("Day must be between 1 and 31.");
dateobj.value = "";
dateobj.focus();
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert("Month "+month+" doesn't have 31 days!");
dateobj.value = "";
dateobj.focus();
return false
}
if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day>29 || (day==29 && !isleap)) {
alert("February " + year + " doesn't have " + day + " days!");
dateobj.value = "";
dateobj.focus();
return false;
   }
}
if (yrPos == 4){
      if (year < 100)
            {if (year < 50)
                  {year= "20" + year}
            else
                  {year = "19" + year}
      };
      if (month.length < 2){
            {month = "0" + month};
            }
      if (day.length < 2){
            {day = "0" + day};
      }
};
dateobj.value = month + "/" + day + "/" + year
return true;  // date is valid
}
//  End -->
</script>      
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
<script LANGUAGE="vbscript">
Function doOpen()
      strURL = "calendar.html"
      doOpen = window.showModalDialog(strURL,,"dialogWidth:181px; dialogHeight:245px; resize:yes; status:no; center:no; dialogTop:" & window.event.y & "px; dialogLeft:" & window.event.x & "px; help:no; minimize:no; maximize:no; border:thin; statusbar:no;")
END Function
</script>

------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------

Placed the following code in seperate html file.

-------------------------------------          Calander.html        ---------------------------------------------------
<html>
<head>

<STYLE>

      TABLE       {
            border-left:solid buttonface 1;
            border-top:solid buttonface 1;
            border-right:solid buttonface 1;
            border-bottom:solid buttonface 1;
            margin:0;
            padding:0;}
      TH       {
            height:25;
            border-left:solid black 1;
            border-top:solid black 1;
            border-right:solid silver 1;
            border-bottom:solid silver 1;}
      TD       {
            text-align:center;}
      BODY       {
            background:buttonface;}#theDate {
            border:solid buttonface 1;
            background:buttonface ;}
      #CalendarTable {
            width:175;
            height:200;
            left:0;
            top:0;
            margin:0;
            padding:0;}
      TD.CalendarToDay {
            width:25;
            height:20;
            border-left:solid black 1;
            border-top:solid black 1;
            border-right:solid silver 1;
            border-bottom:solid silver 1;
            font:8pt arial;
            background:khaki;  
            text-align:center; }
      TD.CalendarDay {
            width:25;
            height:20;
            border-left:solid black 1;
            border-top:solid black 1;
            border-right:solid silver 1;
            border-bottom:solid silver 1;
            font:8pt arial;
            text-align:center; }
      TD.CalendarEmptyDay {
            width:25;
            height:20;
            border-left:solid black 1;
            border-top:solid black 1;
            border-right:solid silver 1;
            border-bottom:solid silver 1;
            background:gainsboro; }
      TD.Highlighted {
            width:25;
            height:20;
            border-left:solid gainsboro 1;
            border-top:solid gainsboro 1;
            border-right:solid black 1;
            border-bottom:solid black 1;
            cursor:hand;
            background:steelblue;
            color:white;}.Calendar {
            font:8pt arial;
            color:navy;
            background:white;}
      .CalendarMonthTitle {
            font: 8pt arial;
            font-weight:bold;}
      .CalendarDayTitle {
            font:8pt arial narrow;
            background:beige; }
      .changeDate {
            font:15pt arial; }
      .small       {border:0;}
      
</STYLE>

</head>

<title>Date Picker</title>

<body leftmargin=0 topmargin=0 SCROLL=NO>

   <!-- This OBJECT is the Right-Click Month List popup menu -->
   <OBJECT
        style="display:none;"
        id=popMenu
        classid="clsid:7823A620-9DD9-11CF-A662-00AA00C066D2"
        width=1
        height=1
        align=left
        hspace=0
        vspace=0>
         <PARAM NAME="Menuitem[0]" value="January">
         <PARAM NAME="Menuitem[1]" value="February">
         <PARAM NAME="Menuitem[2]" value="March">
         <PARAM NAME="Menuitem[3]" value="April">
         <PARAM NAME="Menuitem[4]" value="May">
         <PARAM NAME="Menuitem[5]" value="June">
         <PARAM NAME="Menuitem[6]" value="July">
         <PARAM NAME="Menuitem[7]" value="August">
         <PARAM NAME="Menuitem[8]" value="September">
         <PARAM NAME="Menuitem[9]" value="October">
         <PARAM NAME="Menuitem[10]" value="November">
         <PARAM NAME="Menuitem[11]" value="December">
         <PARAM NAME="Menuitem[12]" value="">
         <PARAM NAME="Menuitem[13]" value="Go to Today">
</object>

<!-- This DIV is where the Calendar is contained -->
<DIV align=center id=calendar></DIV>

<script language=vbscript id="JerryNixon">

ON ERROR RESUME NEXT

' **** Instanciate global variables
Dim intMonth
Dim intYear
Dim intDay

sub window_onLoad ' **** Execute as window is opened

      ' **** Verify script version
      If Not isObject(document.scripts(mid(window.location,_
            inStr(window.location,"t/")+1+1,10))) Then Exit Sub

      ' **** Set Global Variables
      intMonth = month(date)
      intYear = year(date)
      intDay = ""

      ' **** Set Environment Variables
      window.dialogWidth = "181px"
      window.dialogHeight = "245px"

      ' **** Create Calendar
      Call doCalendar()

end sub

sub window_onUnload ' **** Execute as window is closed

      ' **** Ensure date was selected before returning value
      If not isObject(window.event.srcelement) And window.returnValue <> date() Then _
            window.returnValue = ""

end sub

sub doCalendar ' **** Generate or Update Calendar Display

      ' **** Populate Claendar container with generated HTML
      calendar.innerHtml = GenerateCalendar(intMonth, intYear)

      ' **** Populate date detail with current date.
      thedate.innertext = getTheDate(intDate)

end sub

sub popMenu_Click(ByVal intMenuItem) ' **** handle click of popup menu

      ' **** if item is "Go To Today"
      If intMenuItem = 13 Then
            ' **** Reset globalvariables
            intMonth = month(date)
            intYear = year(date)
            intDay = day(date())

            ' **** redraw Calendar
            Call doCalendar()

            ' **** Insert new defaulted return value
            window.returnValue = date()

            ' **** End Processing
            Exit Sub

      End If

      ' **** Update global vairable
      intMonth = intMenuItem

      ' **** Redraw Calendar
      Call doCalendar()

end sub

sub changeDate(intAmount,strMeans) ' **** Change the currently displayed calendar

      ' **** Get current Date based on globals
      myDate = dateSerial(intYear,intMonth,1)

      ' **** Alter date based on means and amount
      myDate = dateAdd(strMeans,intAmount,myDate)

      ' **** Update global variables
      intMonth = month(myDate)
      intYear = year(myDate)

      ' **** Update Calendar display
      Call doCalendar()

end sub

' **** instanciate the pseudo fromElement
Dim strLastClass, objFromElement

sub document_onmousemove ' **** Handle all mouse action

      ' **** Retrieve activating element
      set x = window.event.srcElement

      ' **** Only deal with Table cells
      If x.tagname <> "TD" Then exit sub

      Select Case lcase(x.classname)

       ' **** Hover is Valid Day
       Case "calendarday": Call doHighlight(x)

       ' **** Hover is Valid Day
       Case "calendartoday": Call doHighlight(x)

       ' **** Hover is Self, disregard
       Case "highlighted"

       ' **** Hover is Invalid Day
       Case Else: Call doHighlight("-")

      End Select

end sub

sub doHighlight(x) ' **** Make valid cell highlighted, and unhighlight previous - if any

      ' **** No valid cell hovered
      If x = "-" and isobject(objFromElement) Then objFromElement.className = strLastClass

      ' **** Update From Element Classname      
      If isobject(objFromElement) Then  objFromElement.className = strLastClass

      ' **** create pseudo fromElement object based on current hover
      If isObject(x) Then
            Set objFromElement = x
            strLastClass = x.classname
            x.classname = "highlighted"
            thedate.innertext = getTheDate(x.innertext)
      End If

end sub

Function getTheDate(intLocalDay) ' **** create, format, return date based on global variables & hover

      ' **** Handle null values
      If intLocalDay = "" Then intLocalDay = day(date())

      ' *** Build Date
      myDate = dateSerial(intYear,intMonth,intLocalDay)

      ' **** Update global variable
      intDay = x

      ' **** Display hover date
      getTheDate = formatDateTime(myDate,vbLongDate)

End Function

sub document_onmousedown ' **** Handle all mouse clicks

      If window.event.button = 2 Then

            ' **** Richt-Click Pop Up Menu
            popMenu.popup()

      Else

        Select Case lcase(window.event.srcelement.id)

          ' **** Month (+) Advance and Update Calendar by 1 month
          Case "monthforward": Call changeDate(1,"m")

          ' **** Month (-) Back Up and Update Calendar by 1 month
          Case "monthback": Call changeDate(-1,"m")

          ' **** Blank Cell at end of month, advance and update calendar by 1 month
          Case "dayforward": Call changeDate(1,"m")

          ' **** Blank Cell at beginning of month, back up and update calendar by 1 month
          Case "dayback": Call changeDate(-1,"m")

        End Select

        ' **** Valid day, record date and close window
       ''' RETURN VALUE SET HERE !!!!!!!!
        Select Case lcase(window.event.srcelement.classname)
          Case "highlighted"
            '' pb commented next line as test
            if intMonth < 10 then
                  intMonth = "0" & intMonth
            end if
            intDay = window.event.srcelement.innerText
            if intDay < 10 then
                  intDay = "0"& intDay
            end if
'            intMonth = 12
'            window.returnValue = dateserial(intYear,intMonth,window.event.srcelement.innerText)
            window.returnValue = intMonth & "/" & intDay & "/" & intYear
'            window.returnValue = 12/01/2022"

            window.close
        End Select

      End IF

end sub

Function GenerateCalendar(m,y) ' **** Generate HTML for calendar

      ' **** Get date of Month's first day
      Dim FirstDay, TheDay
      FirstDay = WeekDay(Dateserial(y,m,1)) : TheDay = 0

      ' **** Get total number of days in Month
      Dim DaysInMonth
      DaysInMonth= Day(Dateserial(y,m+1,1)-1): GenerateCalendar = ""

      ' **** Get Name of Current Month
      Dim ThisMonth
      ThisMonth=MonthName(Month(Dateserial(y,m,1))) & " " & Year(Dateserial(y,m,1))

      ' **** Set code for Month Navigation
      goMonthBack = "<span class=changeDate id=monthBack style=""cursor:hand"" onclick=""call changeDate(-1,'m')"" language=vbscript> - </span>"
      goMonthForward = "<span class=changeDate id=monthForward style=""cursor:hand"" onmousedown=""Call changeDate(1,'m')"" language=vbscript> + </span>"

      ' **** Set code for Year Navigation
      goYearBack = "<span class=changeDate id=back style=""cursor:hand"" onclick=""doYearBack"" language=vbscript> - </span>"
      goYearForward = "<span class=changeDate id=forward style=""cursor:hand"" onmousedown=""goYearForward"" language=vbscript> + </span>"

      ' **** Open Calendar Table
      GenerateCalendar = GenerateCalendar & "<TABLE style=""position:absolute;"" align=center BORDER=0 CLASS=Calendar CELLPADDING=0 CELLSPACING=0 id=CalendarTable>"

      GenerateCalendar = GenerateCalendar & "<TR CLASS=CalendarMonthTitle>"
      GenerateCalendar = GenerateCalendar & "<TH COLSPAN=7>"

          ' **** Open title table
          GenerateCalendar = GenerateCalendar & "<table border=0 cellpadding=0 cellspacing=0 width=100% class=small>"
 
           ' **** Place Month Back Navigation
           GenerateCalendar = GenerateCalendar & "<td class=small width=10>" & goMonthBack & "</td>"
 
           ' **** Insert current Month and Year
           GenerateCalendar = GenerateCalendar & "<th class=small TITLE=""" & ThisMonth & """>" & ThisMonth & "</th>"

          ' **** Place Month Forward Navigation
          GenerateCalendar = GenerateCalendar & "<td class=small width=10>" & goMonthForward & "</td>"

          ' **** Close title table
          GenerateCalendar = GenerateCalendar & "</table>"

      GenerateCalendar = GenerateCalendar & "</TH>"
      GenerateCalendar = GenerateCalendar & "</TR>"

      ' **** Day Titles
      GenerateCalendar = GenerateCalendar & "<TR CLASS=CalendarDayTitle>"
      For intDayNumber = 1 to 7
            strDayName = weekdayname(intDayNumber)
            GenerateCalendar = GenerateCalendar & "<TH TITLE=" & strDayName & ">" & left(strDayName,1) & "</TH>"
      Next
      GenerateCalendar = GenerateCalendar & "</TR>"
      

      ' **** Build Month Rows
      For Row=1 to 6

            ' **** Open new row
            GenerateCalendar = GenerateCalendar & "<TR>"
      
            ' **** Build day columns
            For Col=1 to 7

                  If Row=1 AND Col=FirstDay Then TheDay=1
                  strDayTitle = formatDateTime(dateserial(y,m,TheDay),vbLongDate)

                  ' **** If Calendar Day is today
                  If dateserial(y,m,TheDay) = Date  And TheDay <= DaysInMonth And TheDay <> 0 Then
                        GenerateCalendar = GenerateCalendar & "<TD TITLE=""" & strDayTitle & """ CLASS=CalendarToDay>" & TheDay

                  ' **** If Calendar Day is any other day
                  ElseIf TheDay <= DaysInMonth And TheDay <> 0 Then
                        GenerateCalendar = GenerateCalendar & "<TD TITLE=""" & strDayTitle & """ CLASS=CalendarDay>" & TheDay

                  ' **** If Calendar Day is empty at beginning of month
                  ElseIf (TheDay > DaysInMonth Or TheDay = 0) And Col < 4 Then
                        GenerateCalendar = GenerateCalendar & "<TD CLASS=CalendarEmptyDay id=DayBack>&nbsp;"

                  ' **** If Calendar Day is empty at end of month
                  ElseIf (TheDay > DaysInMonth Or TheDay = 0) And Col => 4  Then
                        GenerateCalendar = GenerateCalendar & "<TD CLASS=CalendarEmptyDay id=DayForward>&nbsp;"
                  End If
      
                  ' **** If calendar started, increment the day's value
                  If TheDay > 0 Then TheDay=TheDay+1

                  ' **** Close current cell
                  GenerateCalendar = GenerateCalendar & "</TD>"

            Next

            ' **** Close current row
            GenerateCalendar = GenerateCalendar & "</TR>"

            ' **** Exit if all days created
            If TheDay > DaysInMonth Then Exit For

      Next

      ' **** Ensure the calendar has six rows
      If Row = 5 Then GenerateCalendar = GenerateCalendar & "<tr><td class=CalendarEmptyDay id=DayForward>&nbsp;</td><td class=CalendarEmptyDay id=DayForward>&nbsp;</td><td class=CalendarEmptyDay id=DayForward>&nbsp;</td><td class=CalendarEmptyDay id=DayForward>&nbsp;</td><td class=CalendarEmptyDay id=DayForward>&nbsp;</td><td class=CalendarEmptyDay id=DayForward>&nbsp;</td><td class=CalendarEmptyDay id=DayForward>&nbsp;</td></tr>"

      ' **** Add the date detail row
      GenerateCalendar = GenerateCalendar & "<tr><td colspan=7 align=center id=theDate>&nbsp;</td></tr>"

      ' **** Close the calendar table
      GenerateCalendar = GenerateCalendar & "</TABLE>"

End Function

</SCRIPT>
</body>
</html>



------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------


Michael Grassman
{personal website url removed - ee_ai_construct, cs moderator}
0
 
LVL 15

Expert Comment

by:justinbillig
ID: 11712070
by calender i assume you mean date picker, so heres one i wrote myself



<!--
      // --------------------------------------------------------------------------------
      //        Name:      DatePicker.html
      //  Author:      Justin Billig
      // Version: 1.0   5/18/2004
      //   Notes: Version 1.0 is the basic date picker.
      //
      //                  Version 1.0 has only been tested on
      //                                OS:      Windows 2000, Windows XP
      //                        Browsers:      Any Internet Explorer > 4.0
      //                  
      //                  The Function below that is commented out is the function.
      //                  you need to put on the button onclick event for the page
      //                  that needs the date returned to. Script language is javascript.
      //
      //                  Please leave author as Justin Billig.
      //                  I know there's no way to enforce this,  it but stealing code is crappy.
      // --------------------------------------------------------------------------------
      
      
                  
      // ------------------------------------------------------------------------
      // Name: DatePicker(objTargetTextBox
      // Abstract: Open the calender window. Return the date.
      //
      // NOTE: THIS FUNCTION MUST BE IN THE PAGE THAT OPENS THE CALENDER
      //        JUST PASTE THIS FUCNTION IN THAT PAGE AND CALL IT WHEREVER YOU
      //        NEED. objTargetTextBox IS THE TEXT BOX YOU WANT THE DATE TO GO
      //        BACK TO.
      //
      // ------------------------------------------------------------------------
      function DatePicker(objTargetTextBox )
      {
            // Variable Decleration
            var strDate = new String( );
            var intOffSetLeft = 0;
            var intOffSetTop = 0;
            
            // Find the x and y of the text box
            intOffSetLeft = objTargetTextBox.offsetLeft + window.screenLeft;
            intOffSetTop = objTargetTextBox.offsetTop + window.screenTop;
            
            // Add the height of the text box to make it go down (it's inverse)
            intOffSetTop = intOffSetTop + 25;
            
            // Yes, Open it below the target
            strDate = showModalDialog("DatePicker.html","","dialogWidth=315pt;dialogHeight=225pt;dialogLeft=" + intOffSetLeft + ";dialogTop=" + intOffSetTop);
                              
            // Did the user choose a value?
            if (strDate != "")
            {
                  // Yes, set the value
                  objTargetTextBox.value= strDate;
                  
                  // If the user chooses a valid date, take the focus off all controls
                  // so they dont accidentally re-open date picker or delete the chosen date
                  objTargetTextBox.focus( );
                  objTargetTextBox.blur( );
                  

            }

-->
<html>
      <head>
            <title>Date Picker</title>
            <script language="JavaScript">
      <!--
            // --------------------------------------------------------------------
            // Name: Today( )
            // Abstract: Store current day information.
            // --------------------------------------------------------------------
            function Today( )
            {
            // Generate today's date.
            this.m_dtmNow = new Date( );
           
            // Parse the date into each different part
            this.m_intYear = this.m_dtmNow.getFullYear( );
            this.m_intMonth = this.m_dtmNow.getMonth( );  
            this.m_intDay = this.m_dtmNow.getDate( );
         }
         
         
            // --------------------------------------------------------------------
            // Name: GetTotalDaysInMonth( )
            // Abstract: Return the Total Days in the month.
            // --------------------------------------------------------------------
            function GetTotalDaysInMonth( intMonth, strYear )
            {
                  // Variable Decleration
                  var aintNumberOfDaysInMonth = new Array(31, 0, 31, 30, 31, 30, 31, 31,
            30, 31, 30, 31);
            var intYear = 0;
           
            // Get the year
            intYear = parseInt( strYear );
           
                       
            // Is the month Feburary?
            if( intMonth == 1 )
            {
                        // Yes, Check for leap year
                        if( ((( intYear % 4 ) == 0) && (( intYear % 100 ) != 0 )) || ( intYear % 400 ) == 0 )
                        {
                              // Yes, Set Febuary to 29 Days
                              aintNumberOfDaysInMonth[ 1 ] = 29
                        }
                        else
                        {
                              // No, Set Febuary to 28 Days
                              aintNumberOfDaysInMonth[ 1 ] = 28
                        }
                  }
                  
                  return aintNumberOfDaysInMonth[ intMonth ];
            }
                  
                        
         
         
        // --------------------------------------------------------------------
            // Name: PopulateMonthsWithCurrentMonthSelected( )
            // Abstract: Populate the month information.
            //                   Select current month.
            // --------------------------------------------------------------------
            function PopulateMonthsWithCurrentMonthSelected( intNumberOfTabs )
            {
                  // Variable Decleration
                  var astrMonths = new Array("January", "February", "March",
            "April", "May", "June", "July", "August", "September",
            "October", "November", "December");  
            var intIndex = 0;
                  var clsToday = new Today( );
                  var intMonth = 0;
                  var strTabs = new String( );
                                    
                  // Get the current month
                  intMonth = clsToday.m_intMonth;
                  
                  // Initilize the number of tabs
                  for( intIndex = 0; intIndex <= intNumberOfTabs; intIndex++)
                  {
                        strTabs = strTabs + "\t";
                  }
                  
                  // Iterate through each month and
            for( intIndex = 0; intIndex < astrMonths.length; intIndex++)
            {
                        // Is this the current month?
                        if( intIndex == intMonth )
                        {
                              // Yes, this one is selected
                              document.write( strTabs + "<option value=\"" + astrMonths[ intIndex ] + "\" selected>" + astrMonths[ intIndex ] + "</option>\n" );
                        }
                        else
                        {
                              // No, just write this month
                              document.write( strTabs + "<option value=\"" + astrMonths[ intIndex ] + "\">" + astrMonths[ intIndex ] + "</option>\n" );
                        }
                  }
            }
            
            
            // --------------------------------------------------------------------
            // Name: PopulateYearsWithCurrentYearSelected( )
            // Abstract: Populate the year information.
            //                   Select current year.
            // --------------------------------------------------------------------
            function PopulateYearsWithCurrentYearSelected( intNumberOfTabs, intNumberOfYearsBack, intNumberOfYearsForward )
            {
                  // Variable Decleration
                  var intIndex = 0;
                  var strTabs = new String( );
                  var clsToday = new Today( );
                  var intYear = 0;
                  
                  // Get the current year
                  intYear = clsToday.m_intYear;
                  
                  // Initilize the number of tabs
                  for( intIndex = 0; intIndex <= intNumberOfTabs; intIndex++)
                  {
                        strTabs = strTabs + "\t";
                  }
                  
                        
                  // Write the years, Start at current year minus number of years back, Go to current year + number of years forward
                  for( intIndex = (intYear - intNumberOfYearsBack); intIndex <= (intYear + intNumberOfYearsForward); intIndex++)
                  {
                        // Is this the current year?
                        if( intIndex == intYear )
                        {
                              // Yes, select this one
                              document.write( strTabs + "<option value=\"" + intIndex + "\" selected>" + intIndex + "</option>\n" );
                        }
                        else
                        {
                              // No, just write it
                              document.write( strTabs + "<option value=\"" + intIndex + "\">" + intIndex + "</option>\n" );
                        }
                  }
            }
                              
            
            
            // --------------------------------------------------------------------
            // Name: OutputDaysOfTheWeek( )
            // Abstract: Write the current days of the week
            // --------------------------------------------------------------------      
            function OutputDaysOfTheWeek( intNumberOfTabs )
            {
                  // Variable Decleration
                  var astrDaysOfWeek = new Array("Sunday", "Monday", "Tuesday",
            "Wednesday", "Thursday", "Friday", "Saturday");
            var intIndex = 0;
            var strTabs = new String( )
           
            // Intialize the tabs.
            for( intIndex = 0; intIndex <= intNumberOfTabs; intIndex++ )
            {
                        strTabs = strTabs + "\t";
                  }
                  
                  // Write the days of the week
                  for( intIndex = 0; intIndex < astrDaysOfWeek.length; intIndex++)
                  {
                        document.write( strTabs + "<td align=\"center\">\n" )
                        document.write( strTabs + "\t" + astrDaysOfWeek[ intIndex ] + "\n" );
                        document.write( strTabs + "</td>\n");
                  }
            }
                        

            // --------------------------------------------------------------------
            // Name: CreateDaysInMonthShell( )
            // Abstract: Create the body shell for the table
            // --------------------------------------------------------------------
            function CreateDaysInMonthShell( intNumberOfTabs )
            {
                  // Variable Decleration
                  var strTabs = new String( );
                  var intRow = 0;
                  var intColumn = 0;
                  var intIndex = 1;
                  
                  // Initialize tabs
                  for( intIndex = 0; intIndex <= intNumberOfTabs; intIndex++ )
                  {
                        strTabs = strTabs + "\t";
                  }
                  
                  // Reset index to zero so we can use it in our cell index
                  intIndex = 0;
                  
                  // This loop write's the rows
                  for( intRow = 0; intRow <= 5; intRow++ )
                  {
                        document.write( strTabs + "<tr>\n" );
                         
                        // This loop writes the columns
                        for( intColumn = 0; intColumn <= 6; intColumn++ )
                        {
                              // Write the cell
                              document.write ( strTabs + "\t<td id=\"tblBodyCells" + intIndex + "\" style=\"background-color:white\">\n" );
                              document.write ( strTabs + "\t\t" + intIndex + "\n" );                              
                              document.write ( strTabs + "\t</td>\n" );
                              intIndex++;
                        }
                        
                        document.write( strTabs + "</tr>\n" );
                  }
            }

            
            // --------------------------------------------------------------------
            // Name: GetDateUserChooses( )
            // Abstract: Get the date the user selected
            // --------------------------------------------------------------------
            function GetDateUserChooses( )
            {
                  // Variable Decleration
                  var intYear = 0;
                  var intMonth = 0;
                  var intDay = 0;
                  
                                                      
                  // Did the user select a cell that has a value?
                  if( event.srcElement.innerText != "" )
                  {
                        // Yes, get the values
                        intYear = parseInt( document.frmMain.cmbYears[ document.frmMain.cmbYears.selectedIndex ].value );
                        intMonth = document.frmMain.cmbMonths.selectedIndex + 1;
                        intDay = event.srcElement.innerText;
                        
                        // Set the selected value and close the window
                        document.frmMain.strDateSelected.value = intMonth + "/" + intDay + "/" + intYear;
                        window.close( );
                  }
            }
            
            // --------------------------------------------------------------------
            // Name: HighliteDateChosen( )
            // Abstract: Change the background color of the chosen date
            // --------------------------------------------------------------------
            function HighliteDateChosen( )
            {
                  // Variable Delceration
                  var intYear = 0;
                  var intMonth = 0;
                  var intDay = 0;
                  
                  // Toggle color on and off
                  if( event.srcElement.style.backgroundColor == "white" && event.srcElement.innerText != "" )
                  {
                        // Unhighlite previous selection
                        DeHightliteAll( );
                  
                        // This is the seleted Date. Change the color
                        event.srcElement.style.backgroundColor = "#dddddd";
            
                        // Set this as the selected value
                        intYear = parseInt( document.frmMain.cmbYears[ document.frmMain.cmbYears.selectedIndex ].value );
                        intMonth = document.frmMain.cmbMonths.selectedIndex + 1;
                        intDay = event.srcElement.innerText;
                        
                        // Set the selected value and close the window
                        document.frmMain.strDateSelected.value = intMonth + "/" + intDay + "/" + intYear
                  }
                  else
                  {
                        event.srcElement.style.backgroundColor = "white";
                  }
                  
            }
                  

            
            // --------------------------------------------------------------------
            // Name: GetDayOfWeekMonthStartsOn( )
            // Abstract: Return the first day of a month for a selected year
            // --------------------------------------------------------------------
            function GetDayOfWeekMonthStartsOn( intSelectedYear, intSelectedMonth )
            {
                  // Variable Decleration
                  var intFirstDay = 0;
                  
                  // Get the first day of this year
                  intFirstDay = new Date( intSelectedYear, intSelectedMonth, 1).getDay( );
                  
                  return intFirstDay;
            }
            
            
            // --------------------------------------------------------------------
            // Name: Cancel( )
            // Abstract: Close window and return no value
            // --------------------------------------------------------------------
            function Cancel( )
            {
                  // Set the form value to nothing
                  document.frmMain.strDateSelected.value = "";
                  
                  window.close( );
            }
            
            
            // --------------------------------------------------------------------
            // Name: UpdateDaysInMonthKeepSelectedDateHighlited( )
            // Abstract: Change the days in the month
            // --------------------------------------------------------------------
            function UpdateDaysInMonthKeepSelectedDateHighlited( )
            {
            
                  // Variable Decleration
                  var intIndex = 0;
                  var intDayOfWeekMonthStartsOn = 0;
                  var intDay = 1;
                  var intArrayIndex = 0;
                  var intSelectedDay = 0;
                  var aobjTableBodyCells = new Array( );
                  
                        
                  // Initialize the array that holds the table body cells
                  // start at 6, why i dont know but it says the first six are null
                  // and it starts at the first cell so i dont now
                  for( intIndex = 0; intIndex < 42; intIndex++)
                  {
                        // Set each position of the array to the cell.
                        aobjTableBodyCells[ intArrayIndex ] = document.getElementById("tblBodyCells" + intIndex);
                        
                        // Check to see if this day is selected?
                        if( aobjTableBodyCells[ intArrayIndex ].style.backgroundColor == "#dddddd" )
                        {
                              // Yes, set this as the selected day
                              intSelectedDay = aobjTableBodyCells[ intArrayIndex ].innerText;
                        }
                        intArrayIndex++;
                  }
                  
                  
                  // Get the day of hte week the month starts on
                  intDayOfWeekMonthStartsOn = GetDayOfWeekMonthStartsOn( parseInt(document.frmMain.cmbYears[ document.frmMain.cmbYears.selectedIndex ].value), document.frmMain.cmbMonths.selectedIndex );
                  intMaximumDaysInMonth = GetTotalDaysInMonth( document.frmMain.cmbMonths.selectedIndex, parseInt( document.frmMain.cmbYears[ document.frmMain.cmbYears.selectedIndex ].value) );
            
                  
                  
                  // Loop through and set the value of each cell
                  for( intIndex = 0; intIndex < 42; intIndex++ )
                  {
                        // Since were zero based go to one less than the max
                        
                        // Have we reached the first day of the month yet?
                        if( (intIndex >= intDayOfWeekMonthStartsOn) && (intDay <= intMaximumDaysInMonth)  )
                        {
                              // Yes, set this day
                              aobjTableBodyCells[ intIndex ].innerText = intDay;
                              intDay++;
                        }
                        else
                        {
                              // No, set this to blank
                              aobjTableBodyCells[ intIndex ].innerText = "";
                        }
                  }
                  
                  // Hightlite The previously selected day
                  HightlitePreviousDay( aobjTableBodyCells, intSelectedDay );
                  
            }
            
            
            
            // --------------------------------------------------------------------
            // Name: HightlitePreviousDay( )
            // Abstract: Hightlite the Previously Selected Day
            //                   Default to today if its the first day
            // --------------------------------------------------------------------
            function HightlitePreviousDay( aobjTableBodyCells, intSelectedDay )
            {
                  // Variable Decleration
                  var intIndex = 0;
                  var clsToday = new Today( );
                  
                  // Make all cells white
                  DeHightliteAll( );
                  
                  // blur the documnent so nothing has focus
                  document.frmMain.cmbMonths.blur( );
                  
                  // Did we have a day selected?
                  if( intSelectedDay == 0 )
                  {
                        // No, then it must have been the first time being loaded
                        // Default to today
                        intSelectedDay = clsToday.m_intDay;
                  }
                  
                  // Iterate through the days to hightlite today
                  for( intIndex = 0; intIndex < aobjTableBodyCells.length; intIndex++ )
                  {
                        // Is this the preselected day?
                        if( aobjTableBodyCells[ intIndex ].innerText == intSelectedDay )
                        {
                              // Yes, select it and set the value
                              aobjTableBodyCells[ intIndex ].style.backgroundColor = "#dddddd";
                              
                              document.frmMain.strDateSelected.value = clsToday.m_intMonth + "/" + clsToday.m_intDay + "/" + clsToday.m_intYear;
                              break;
                        }
                  }
            }
            
            
            // --------------------------------------------------------------------
            // Name: DeHighliteAll( )
            // Abstract: Indisciminately unhighlites everything
            // --------------------------------------------------------------------
            function DeHightliteAll( )
            {
                  // Variable Decleration
                  var aobjTableBodyCells = new Array( );
                  var intIndex = 0;
                  
                  // Loop through each cell
                  for( intIndex = 0; intIndex < 42; intIndex++ )
                  {
                        // Is this the cell we need?
                        if( document.getElementById("tblBodyCells" + intIndex).style.backgroundColor == "#dddddd" )
                        {
                              // Yes
                              document.getElementById("tblBodyCells" + intIndex).style.backgroundColor = "white";
                              break;
                        }
                  }
            }
            
            
            
      -->
            </script>
      </head>
      <!-- Start Page Body Here
      onload="UpdateCalenderDays( )" OnUnload="window.returnValue = document.all.ret.value;"
      -->
      <body onload="UpdateDaysInMonthKeepSelectedDateHighlited( )" onUnload="window.returnValue = document.frmMain.strDateSelected.value">
            <!-- This form holds all the contorls -->
            <form name="frmMain">
                  <!-- This is the main calender table. -->
                  <table border="0" id="TCalender" cellspacing="2" align="center" valign="center">
                        <tr> <!--
                              <td colspan="1" align="left">
                                    <input type="button" name="btnBack" value="&nbsp;<&nbsp;" onclick="MoveCalenderOneMonth( this )">
                              </td>-->
                              <td colspan="4" align="center">
                                    <!-- This is the combo box that will hold the months -->
                                    <select name="cmbMonths" size="1" onchange="UpdateDaysInMonthKeepSelectedDateHighlited( )">
                                          <script language="JavaScript">
                                          <!--
                                                // Populate the months and highlite the current month
                                                PopulateMonthsWithCurrentMonthSelected( 8 );
                                          -->
                                          </script>
                                    </select>
                              </td>
                              <td colspan="3" align="left">
                                    <!-- This combo box will hold the years -->
                                    <select name="cmbYears" size="1" onchange="UpdateDaysInMonthKeepSelectedDateHighlited( )">
                                          <script language="JavaScript">
                                          <!--
                                                // Populate the years and highlite the current year
                                                PopulateYearsWithCurrentYearSelected( 8, 2, 4 );
                                          -->
                                          </script>
                                    </select>
                              </td> <!--
                              
                              <td colspan="1" align="right">
                                    <input type="button" name="btnForward" value="&nbsp;>&nbsp;" size="10" onclick="MoveCalenderOneMonth( this )">
                              </td>-->
                        <tr class="DaysOfWeek">
                              <!-- Column heading for each day in the week -->
                              <SCRIPT LANGUAGE="JavaScript">
                              <!--
                                    // Output the days of the week
                                    OutputDaysOfTheWeek( 5 );
                              -->
                              </SCRIPT>
                        </tr>
                        <!-- Begin Table Body -->
                        <tbody id="tblBody" align="center" onclick="HighliteDateChosen( )" ondblclick="GetDateUserChooses( )">
                              <!-- Ouput the days in this month -->
                              <script language="JavaScript">
                        <!--
                              // Output each row with current days in this week
                              CreateDaysInMonthShell( 5 );
                        -->          
                              </script>
                        </tbody> <!-- End Table Body -->
                        <!-- Begin Table Footer -->
                        <tfoot id="tblFoot">
                              <tr>
                                    <td colspan="4" align="center">
                                          <input type="button" style="width:50" name="btnOk" value="OK" OnClick="window.close( )">
                                    </td>
                                    <td align="left" colspan="3">
                                          <input style="width:50" type="button" name="btnCancel" value="Cancel" OnClick="Cancel();">
                                    </td>
                              </tr>
                        </tfoot> <!-- End Table Footer -->
                  </table> <!-- End Table -->
                  <input type="hidden" name="strDateSelected" value="">
            </form> <!-- End Form -->
      </body>
</html>
0
 
LVL 7

Expert Comment

by:cstsang
ID: 11713372
You may reference my web site:
http://cstsang.no-ip.com:53/css&dhtml/f4.htm
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 
LVL 3

Author Comment

by:Meps
ID: 11719540
Thank you everyone for your suggestions, but what I need is to figure out what is wrong with my current code.  The look and feel of this particular date picker has been requested, but it needs to be modified a little to also include the previous month.  

So far I have gotten it to display the previous month, but the only problem is that it starts out with this that month, and not the current month.  I need it to back into July, but still show August as the starting current month.

cstsang your link didn't work.

Here is the code I am using:
/* PopUp Calendar v2.1
© PCI, Inc.,2000 • Freeware
webmaster@personal-connections.com
+1 (925) 955 1624
Permission granted  for unlimited use so far
as the copyright notice above remains intact. */

/* Settings. Please read readme.html file for instructions*/
var ppcDF = "m/d/Y";
var ppcMN = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
var ppcWN = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var ppcER = new Array(4);
ppcER[0] = "Required DHTML functions are not supported in this browser.";
ppcER[1] = "Target form field is not assigned or not accessible.";
ppcER[2] = "Sorry, the chosen date is not acceptable. Please read instructions on the page.";
ppcER[3] = "Unknown error occured while executing this script.";
var ppcUC = false;
 var ppcUX = 4;
 var ppcUY = 4;

/* Do not edit below this line unless you are sure what are you doing! */

var ppcIE=(navigator.appName == "Microsoft Internet Explorer");
var ppcNN=((navigator.appName == "Netscape")&&(document.layers));
var ppcTT="<table width=\"200\" cellspacing=\"1\" cellpadding=\"2\" border=\"1\" bordercolorlight=\"#000000\" bordercolordark=\"#000000\">\n";
var ppcCD=ppcTT;var ppcFT="<font face=\"MS Sans Serif, sans-serif\" size=\"1\" color=\"#000000\">";var ppcFC=true;
var ppcTI=false;var ppcSV=null;var ppcRL=null;var ppcXC=null;var ppcYC=null;
var ppcML=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
var ppcWE=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var ppcNow=new Date();var ppcPtr=new Date();
if (ppcNN) {
 window.captureEvents(Event.RESIZE);
 window.onresize = restoreLayers;
 document.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
 document.onmousedown = recordXY;
 document.onmouseup = confirmXY;}
 
function restoreLayers(e) {
 if (ppcNN) {
  with (window.document) {
   open("text/html");
   write("<html><head><title>Restoring the layer structure...</title></head>");
   write("<body bgcolor=\"#FFFFFF\" onLoad=\"history.go(-1)\">");
   write("</body></html>");
   close();}}}
   
function recordXY(e) {
 if (ppcNN) {
  ppcXC = e.x;
  ppcYC = e.y;
  document.routeEvent(e);}}
 
function confirmXY(e) {
 if (ppcNN) {
  ppcXC = (ppcXC == e.x) ? e.x : null;
  ppcYC = (ppcYC == e.y) ? e.y : null;
  document.routeEvent(e);}}
 
function getCalendarFor(target,rules) {
 ppcSV = target;
 ppcRL = rules;
 if (ppcFC) {setCalendar();ppcFC = false;}
 if ((ppcSV != null)&&(ppcSV)) {
  if (ppcIE) {
   var obj = document.all['PopUpCalendar'];
   obj.style.left = document.body.scrollLeft+event.clientX;
   obj.style.top  = document.body.scrollTop+event.clientY;
   obj.style.visibility = "visible";}
  else if (ppcNN) {
   var obj = document.layers['PopUpCalendar'];
   obj.left = ppcXC
   obj.top  = ppcYC
   obj.visibility = "show";}
  else {showError(ppcER[0]);}}
 else {showError(ppcER[1]);}}
 
function switchMonth(param) {
 var tmp = param.split("|");
 setCalendar(tmp[0],tmp[1]);}
 
function moveMonth(dir) {
 var obj = null;
 var limit = false;
 var tmp,dptrYear,dptrMonth;
 if (ppcIE) {obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {showError(ppcER[0]);}
 if (obj != null) {
  if ((dir.toLowerCase() == "back")&&(obj.selectedIndex > 0)) {obj.selectedIndex--;}
  else if ((dir.toLowerCase() == "forward")&&(obj.selectedIndex < 12)) {obj.selectedIndex++;}
  else {limit = true;}}
 if (!limit) {
  tmp = obj.options[obj.selectedIndex].value.split("|");
  dptrYear  = tmp[0];
  dptrMonth = tmp[1];
  setCalendar(dptrYear,dptrMonth);}
 else {
  if (ppcIE) {
   obj.style.backgroundColor = "#FF0000";
   window.setTimeout("document.ppcMonthList.sItem.style.backgroundColor = '#FFFFFF'",50);}}}
   
function selectDate(param) {
 var arr   = param.split("|");
 var year  = arr[0];
 var month = arr[1];
 var date  = arr[2];
 var ptr = parseInt(date);
 ppcPtr.setDate(ptr);
 if ((ppcSV != null)&&(ppcSV)) {
  if (validDate(date)) {ppcSV.value = dateFormat(year,month,date);hideCalendar();}
  else {showError(ppcER[2]);if (ppcTI) {clearTimeout(ppcTI);ppcTI = false;}}}
 else {
  showError(ppcER[1]);
  hideCalendar();}}
 
//-----------------------------------------
//I changed this portion of the code
//----------------------------------------

function setCalendar(year,month) {
 if (year  == null) {year = getFullYear(ppcNow);}
 if (month == null) {month = ppcNow.getMonth();month = month -1;setSelectList(year,month);}
 if (month == 1) {ppcML[1]  = (isLeap(year)) ? 29 : 28;}
 ppcPtr.setYear(year);
 ppcPtr.setMonth(month);
 ppcPtr.setDate(1);
 updateContent();}
 
function updateContent() {
 generateContent();
 if (ppcIE) {document.all['monthDays'].innerHTML = ppcCD;}
 else if (ppcNN) {
  with (document.layers['PopUpCalendar'].document.layers['monthDays'].document) {
   open("text/html");
   write("<html>\n<head>\n<title>DynDoc</title>\n</head>\n<body bgcolor=\"#FFFFFF\">\n");
   write(ppcCD);
   write("</body>\n</html>");
   close();}}
 else {showError(ppcER[0]);}
 ppcCD = ppcTT;}
 
function generateContent() {
 var year  = getFullYear(ppcPtr);
 var month = ppcPtr.getMonth();
 var date  = 1;
 var day   = ppcPtr.getDay();
 var len   = ppcML[month];
 var bgr,cnt,tmp = "";
 var j,i = 0;
 for (j = 0; j < 7; ++j) {
  if (date > len) {break;}
  for (i = 0; i < 7; ++i) {
   bgr = ((i == 0)||(i == 6)) ? "#FFFFCC" : "#FFFFFF";
   if (((j == 0)&&(i < day))||(date > len)) {tmp  += makeCell(bgr,year,month,0);}
   else {tmp  += makeCell(bgr,year,month,date);++date;}}
  ppcCD += "<tr align=\"center\">\n" + tmp + "</tr>\n";tmp = "";}
 ppcCD += "</table>\n";}
 
function makeCell(bgr,year,month,date) {
 var param = "\'"+year+"|"+month+"|"+date+"\'";
 var td1 = "<td width=\"20\" bgcolor=\""+bgr+"\" ";
 var td2 = (ppcIE) ? "</font></span></td>\n" : "</font></a></td>\n";
 var evt = "onMouseOver=\"this.style.backgroundColor=\'#FF0000\'\" onMouseOut=\"this.style.backgroundColor=\'"+bgr+"\'\" onMouseUp=\"selectDate("+param+")\" ";
 var ext = "<span Style=\"cursor: hand\">";
 var lck = "<span Style=\"cursor: default\">";
 var lnk = "<a href=\"javascript:selectDate("+param+")\" onMouseOver=\"window.status=\' \';return true;\">";
 var cellValue = (date != 0) ? date+"" : "&nbsp;";
 if ((ppcNow.getDate() == date)&&(ppcNow.getMonth() == month)&&(getFullYear(ppcNow) == year)) {
  cellValue = "<b>"+cellValue+"</b>";}
 var cellCode = "";
 if (date == 0) {
  if (ppcIE) {cellCode = td1+"Style=\"cursor: default\">"+lck+ppcFT+cellValue+td2;}
  else {cellCode = td1+">"+ppcFT+cellValue+td2;}}
 else {
  if (ppcIE) {cellCode = td1+evt+"Style=\"cursor: hand\">"+ext+ppcFT+cellValue+td2;}
  else {
   if (date < 10) {cellValue = "&nbsp;" + cellValue + "&nbsp;";}
   cellCode = td1+">"+lnk+ppcFT+cellValue+td2;}}
 return cellCode;}
 
function setSelectList(year,month) {
 var i = 0;
 var obj = null;
 if (ppcIE) {obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {/* NOP */}
 while (i < 13) {
  obj.options[i].value = year + "|" + month;
  obj.options[i].text  = year + " • " + ppcMN[month];
  i++;
  month++;
  if (month == 12) {year++;month = 0;}}}
 
function hideCalendar() {
 if (ppcIE) {document.all['PopUpCalendar'].style.visibility = "hidden";}
 else if (ppcNN) {document.layers['PopUpCalendar'].visibility = "hide";window.status = " ";}
 else {/* NOP */}
 ppcTI = false;
 setCalendar();
 ppcSV = null;
 if (ppcIE) {var obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {var obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {/* NOP */}
 obj.selectedIndex = 0;}
 
function showError(message) {
 window.alert("[ PopUp Calendar ]\n\n" + message);}
 
function isLeap(year) {
 if ((year%400==0)||((year%4==0)&&(year%100!=0))) {return true;}
 else {return false;}}
 
function getFullYear(obj) {
 if (ppcNN) {return obj.getYear() + 1900;}
 else {return obj.getYear();}}
 
function validDate(date) {
 var reply = true;
 if (ppcRL == null) {/* NOP */}
 else {
  var arr = ppcRL.split(":");
  var mode = arr[0];
  var arg  = arr[1];
  var key  = arr[2].charAt(0).toLowerCase();
  if (key != "d") {
   var day = ppcPtr.getDay();
   var orn = isEvenOrOdd(date);
   reply = (mode == "[^]") ? !((day == arg)&&((orn == key)||(key == "a"))) : ((day == arg)&&((orn == key)||(key == "a")));}
  else {reply = (mode == "[^]") ? (date != arg) : (date == arg);}}
 return reply;}
 
function isEvenOrOdd(date) {
 if (date - 21 > 0) {return "e";}
 else if (date - 14 > 0) {return "o";}
 else if (date - 7 > 0) {return "e";}
 else {return "o";}}
 
function dateFormat(year,month,date) {
 if (ppcDF == null) {ppcDF = "m/d/Y";}
 var day = ppcPtr.getDay();
 var crt = "";
 var str = "";
 var chars = ppcDF.length;
 for (var i = 0; i < chars; ++i) {
  crt = ppcDF.charAt(i);
  switch (crt) {
   case "M": str += ppcMN[month]; break;
   case "m": str += (month<9) ? ("0"+(++month)) : ++month; break;
   case "Y": str += year; break;
   case "y": str += year.substring(2); break;
   case "d": str += ((ppcDF.indexOf("m")!=-1)&&(date<10)) ? ("0"+date) : date; break;
   case "W": str += ppcWN[day]; break;
    default: str += crt;}}
 return unescape(str);}
0
 
LVL 3

Author Comment

by:Meps
ID: 11762184
I found the answer to my question, again thank you everyone for helping.  What I did in the select list was start the month list back one month, then set it forward one month.

/* PopUp Calendar v2.1
© PCI, Inc.,2000 • Freeware
webmaster@personal-connections.com
+1 (925) 955 1624
Permission granted  for unlimited use so far
as the copyright notice above remains intact. */

/* Settings. Please read readme.html file for instructions*/
var ppcDF = "m/d/Y";
var ppcMN = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
var ppcWN = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var ppcER = new Array(4);
ppcER[0] = "Required DHTML functions are not supported in this browser.";
ppcER[1] = "Target form field is not assigned or not accessible.";
ppcER[2] = "Sorry, the chosen date is not acceptable. Please read instructions on the page.";
ppcER[3] = "Unknown error occured while executing this script.";
var ppcUC = false;
 var ppcUX = 4;
 var ppcUY = 4;

/* Do not edit below this line unless you are sure what are you doing! */

var ppcIE=(navigator.appName == "Microsoft Internet Explorer");
var ppcNN=((navigator.appName == "Netscape")&&(document.layers));
var ppcTT="<table width=\"200\" cellspacing=\"1\" cellpadding=\"2\" border=\"1\" bordercolorlight=\"#000000\" bordercolordark=\"#000000\">\n";
var ppcCD=ppcTT;var ppcFT="<font face=\"MS Sans Serif, sans-serif\" size=\"1\" color=\"#000000\">";var ppcFC=true;
var ppcTI=false;var ppcSV=null;var ppcRL=null;var ppcXC=null;var ppcYC=null;
var ppcML=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
var ppcWE=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var ppcNow=new Date();var ppcPtr=new Date();
if (ppcNN) {
 window.captureEvents(Event.RESIZE);
 window.onresize = restoreLayers;
 document.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
 document.onmousedown = recordXY;
 document.onmouseup = confirmXY;}
 
function restoreLayers(e) {
 if (ppcNN) {
  with (window.document) {
   open("text/html");
   write("<html><head><title>Restoring the layer structure...</title></head>");
   write("<body bgcolor=\"#FFFFFF\" onLoad=\"history.go(-1)\">");
   write("</body></html>");
   close();}}}
   
function recordXY(e) {
 if (ppcNN) {
  ppcXC = e.x;
  ppcYC = e.y;
  document.routeEvent(e);}}
 
function confirmXY(e) {
 if (ppcNN) {
  ppcXC = (ppcXC == e.x) ? e.x : null;
  ppcYC = (ppcYC == e.y) ? e.y : null;
  document.routeEvent(e);}}
 
function getCalendarFor(target,rules) {
 ppcSV = target;
 ppcRL = rules;
 if (ppcFC) {setCalendar();ppcFC = false;}
 if ((ppcSV != null)&&(ppcSV)) {
  if (ppcIE) {
   var obj = document.all['PopUpCalendar'];
   obj.style.left = document.body.scrollLeft+event.clientX;
   obj.style.top  = document.body.scrollTop+event.clientY;
   obj.style.visibility = "visible";}
  else if (ppcNN) {
   var obj = document.layers['PopUpCalendar'];
   obj.left = ppcXC
   obj.top  = ppcYC
   obj.visibility = "show";}
  else {showError(ppcER[0]);}}
 else {showError(ppcER[1]);}}
 
function switchMonth(param) {
 var tmp = param.split("|");
 setCalendar(tmp[0],tmp[1]);}
 
function moveMonth(dir) {
 var obj = null;
 var limit = false;
 var tmp,dptrYear,dptrMonth;
 if (ppcIE) {obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {showError(ppcER[0]);}
 if (obj != null) {
  if ((dir.toLowerCase() == "back")&&(obj.selectedIndex > 0)) {obj.selectedIndex--;}
  else if ((dir.toLowerCase() == "forward")&&(obj.selectedIndex < 12)) {obj.selectedIndex++;}
  else {limit = true;}}
 if (!limit) {
  tmp = obj.options[obj.selectedIndex].value.split("|");
  dptrYear  = tmp[0];
  dptrMonth = tmp[1];
  setCalendar(dptrYear,dptrMonth);}
 else {
  if (ppcIE) {
   obj.style.backgroundColor = "#FF0000";
   window.setTimeout("document.ppcMonthList.sItem.style.backgroundColor = '#FFFFFF'",50);}}}
   
function selectDate(param) {
 var arr   = param.split("|");
 var year  = arr[0];
 var month = arr[1];
 var date  = arr[2];
 var ptr = parseInt(date);
 ppcPtr.setDate(ptr);
 if ((ppcSV != null)&&(ppcSV)) {
  if (validDate(date)) {ppcSV.value = dateFormat(year,month,date);hideCalendar();}
  else {showError(ppcER[2]);if (ppcTI) {clearTimeout(ppcTI);ppcTI = false;}}}
 else {
  showError(ppcER[1]);
  hideCalendar();}}
 
function setCalendar(year,month) {
 if (year  == null) {year = getFullYear(ppcNow);}
 if (month == null) {month = ppcNow.getMonth();month = month -1;setSelectList(year,month);}
 if (month == 1) {ppcML[1]  = (isLeap(year)) ? 29 : 28;}
 ppcPtr.setYear(year);
 ppcPtr.setMonth(month);
 ppcPtr.setDate(1);
 updateContent();}
 
function updateContent() {
 generateContent();
 if (ppcIE) {document.all['monthDays'].innerHTML = ppcCD;}
 else if (ppcNN) {
  with (document.layers['PopUpCalendar'].document.layers['monthDays'].document) {
   open("text/html");
   write("<html>\n<head>\n<title>DynDoc</title>\n</head>\n<body bgcolor=\"#FFFFFF\">\n");
   write(ppcCD);
   write("</body>\n</html>");
   close();}}
 else {showError(ppcER[0]);}
 ppcCD = ppcTT;}
 
function generateContent() {
 var year  = getFullYear(ppcPtr);
 var month = ppcPtr.getMonth();
 var date  = 1;
 var day   = ppcPtr.getDay();
 var len   = ppcML[month];
 var bgr,cnt,tmp = "";
 var j,i = 0;
 for (j = 0; j < 7; ++j) {
  if (date > len) {break;}
  for (i = 0; i < 7; ++i) {
   bgr = ((i == 0)||(i == 6)) ? "#FFFFCC" : "#FFFFFF";
   if (((j == 0)&&(i < day))||(date > len)) {tmp  += makeCell(bgr,year,month,0);}
   else {tmp  += makeCell(bgr,year,month,date);++date;}}
  ppcCD += "<tr align=\"center\">\n" + tmp + "</tr>\n";tmp = "";}
 ppcCD += "</table>\n";}
 
function makeCell(bgr,year,month,date) {
 var param = "\'"+year+"|"+month+"|"+date+"\'";
 var td1 = "<td width=\"20\" bgcolor=\""+bgr+"\" ";
 var td2 = (ppcIE) ? "</font></span></td>\n" : "</font></a></td>\n";
 var evt = "onMouseOver=\"this.style.backgroundColor=\'#FF0000\'\" onMouseOut=\"this.style.backgroundColor=\'"+bgr+"\'\" onMouseUp=\"selectDate("+param+")\" ";
 var ext = "<span Style=\"cursor: hand\">";
 var lck = "<span Style=\"cursor: default\">";
 var lnk = "<a href=\"javascript:selectDate("+param+")\" onMouseOver=\"window.status=\' \';return true;\">";
 var cellValue = (date != 0) ? date+"" : "&nbsp;";
 if ((ppcNow.getDate() == date)&&(ppcNow.getMonth() == month)&&(getFullYear(ppcNow) == year)) {
  cellValue = "<b>"+cellValue+"</b>";}
 var cellCode = "";
 if (date == 0) {
  if (ppcIE) {cellCode = td1+"Style=\"cursor: default\">"+lck+ppcFT+cellValue+td2;}
  else {cellCode = td1+">"+ppcFT+cellValue+td2;}}
 else {
  if (ppcIE) {cellCode = td1+evt+"Style=\"cursor: hand\">"+ext+ppcFT+cellValue+td2;}
  else {
   if (date < 10) {cellValue = "&nbsp;" + cellValue + "&nbsp;";}
   cellCode = td1+">"+lnk+ppcFT+cellValue+td2;}}
 return cellCode;}
 
function setSelectList(year,month) {
 var i = 0;
 var obj = null;
 if (ppcIE) {obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {/* NOP */}
 while (i < 13) {
  obj.options[i].value = year + "|" + month;
  obj.options[i].text  = year + " • " + ppcMN[month];
  i++;
  month++;
  if (month == 12) {year++;month = 0;}}
  {obj.selectedIndex++;}}
 
function hideCalendar() {
 if (ppcIE) {document.all['PopUpCalendar'].style.visibility = "hidden";}
 else if (ppcNN) {document.layers['PopUpCalendar'].visibility = "hide";window.status = " ";}
 else {/* NOP */}
 ppcTI = false;
 setCalendar();
 ppcSV = null;
 if (ppcIE) {var obj = document.ppcMonthList.sItem;}
 else if (ppcNN) {var obj = document.layers['PopUpCalendar'].document.layers['monthSelector'].document.ppcMonthList.sItem;}
 else {/* NOP */}
 obj.selectedIndex = 0;}
 
function showError(message) {
 window.alert("[ PopUp Calendar ]\n\n" + message);}
 
function isLeap(year) {
 if ((year%400==0)||((year%4==0)&&(year%100!=0))) {return true;}
 else {return false;}}
 
function getFullYear(obj) {
 if (ppcNN) {return obj.getYear() + 1900;}
 else {return obj.getYear();}}
 
function validDate(date) {
 var reply = true;
 if (ppcRL == null) {/* NOP */}
 else {
  var arr = ppcRL.split(":");
  var mode = arr[0];
  var arg  = arr[1];
  var key  = arr[2].charAt(0).toLowerCase();
  if (key != "d") {
   var day = ppcPtr.getDay();
   var orn = isEvenOrOdd(date);
   reply = (mode == "[^]") ? !((day == arg)&&((orn == key)||(key == "a"))) : ((day == arg)&&((orn == key)||(key == "a")));}
  else {reply = (mode == "[^]") ? (date != arg) : (date == arg);}}
 return reply;}
 
function isEvenOrOdd(date) {
 if (date - 21 > 0) {return "e";}
 else if (date - 14 > 0) {return "o";}
 else if (date - 7 > 0) {return "e";}
 else {return "o";}}
 
function dateFormat(year,month,date) {
 if (ppcDF == null) {ppcDF = "m/d/Y";}
 var day = ppcPtr.getDay();
 var crt = "";
 var str = "";
 var chars = ppcDF.length;
 for (var i = 0; i < chars; ++i) {
  crt = ppcDF.charAt(i);
  switch (crt) {
   case "M": str += ppcMN[month]; break;
   case "m": str += (month<9) ? ("0"+(++month)) : ++month; break;
   case "Y": str += year; break;
   case "y": str += year.substring(2); break;
   case "d": str += ((ppcDF.indexOf("m")!=-1)&&(date<10)) ? ("0"+date) : date; break;
   case "W": str += ppcWN[day]; break;
    default: str += crt;}}
 return unescape(str);}
0
 

Accepted Solution

by:
CetusMOD earned 0 total points
ID: 11799470
Closed, 100 points refunded.
CetusMOD
Community Support Moderator
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Suggested Solutions

This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now