Here is a script that will let the user select a date. Its written in PHP and uses AJAX. There is one PHP file which does all the work. You need to write a call back function so that you can handle the date how ever you want to, eg if you need it for a form, stick it in a textbox.
This is what the date selector looks like
It is only a quick test to see if i could make a working solution so there could be some bugs in it.
Ok here comes the code
PHP Code:
<?php
if(isset($_GET['script']))
{
?>
function createRequestObject()
{
var request_o; //declare the variable to hold the object.
var browser = navigator.appName; //find the browser name
if(browser == "Microsoft Internet Explorer"){
/* Create the object using MSIE's method */
request_o = new ActiveXObject("Microsoft.XMLHTTP");
}else{
/* Create the object using other browser's method */
request_o = new XMLHttpRequest();
}
return request_o; //return the object
}
/* Function called to handle the list that was returned from the internal_request.php file.. */
function handleCalender(){
/* Make sure that the transaction has finished. The XMLHttpRequest object
has a property called readyState with several states:
0: Uninitialized
1: Loading
2: Loaded
3: Interactive
4: Finished */
try
{
if(http.readyState == 4){ //Finished loading the response
/* We have got the response from the server-side script,
let's see just what it was. using the responseText property of
the XMLHttpRequest object. */
var response = http.responseText;
//alert(response);
//document.write(response);
document.getElementById("calender").innerHTML = response;
}
}
catch(Exception)
{
}
}
/* Function called to get the product categories list */
var http = createRequestObject();
function init()
{
http.open('get', 'dateselect.php');
http.onreadystatechange = handleCalender;
http.send(null);
}
function getCalender(month,year)
{
try
{
http.open('get', 'dateselect.php?month=' + month + '&year=' + year);
http.onreadystatechange = handleCalender;
http.send(null);
}
catch(Exception)
{
http = createRequestObject();
alert('error');
}
}
document.write('<div id="calender"><a href="javascript:init();">Select a Date</a></div>');
<?
}
else
{
<html>
<head>
</head>
<body>
<script>
//this is the callback function that processes the selected date
function selectDate(day,month,year)
{
//there is a layer called "calender" which holds the date selector
document.getElementById("calender").innerHTML = day + '/' + month + '/' + year + ' ' + '<a href="javascript:init();">Select a Date</a>';
}
</script>
<script src="dateselect.php?script"></script>
</body>
</html>
Ok i have made some changes so that this script will be useful. It now allows instances to be used on a single page.
Heres the new script
PHP Code:
<?php
/****************************************************
Creator: John Tindell
Email: linal[_AT_]mindlessant.co.uk
Version: 1.1
Last-Update: 21st April 2006
****************************************************/
if(isset($_GET['script']))
{
?>
function createRequestObject_<?=$_GET['name']?>()
{
var request_o; //declare the variable to hold the object.
var browser = navigator.appName; //find the browser name
if(browser == "Microsoft Internet Explorer"){
/* Create the object using MSIE's method */
request_o = new ActiveXObject("Microsoft.XMLHTTP");
}else{
/* Create the object using other browser's method */
request_o = new XMLHttpRequest();
}
return request_o; //return the object
}
var http_<?=$_GET['name']?> = createRequestObject_<?=$_GET['name']?>();
/* Function called to handle the list that was returned from the internal_request.php file.. */
function handleCalender_<?=$_GET['name']?>(){
/* Make sure that the transaction has finished. The XMLHttpRequest object
has a property called readyState with several states:
0: Uninitialized
1: Loading
2: Loaded
3: Interactive
4: Finished */
try
{
if(http_<?=$_GET['name']?>.readyState == 4){ //Finished loading the response
/* We have got the response from the server-side script,
let's see just what it was. using the responseText property of
the XMLHttpRequest object. */
var response = http_<?=$_GET['name']?>.responseText;
//alert(response);
//document.write(response);
document.getElementById("calenderSelect_<?=$_GET['name']?>").innerHTML = response;
}
}
catch(Exception)
{
}
}
/* Function called to get the product categories list */