View Full Version : Date input script with counting days

09-01-2006, 10:17 AM

i need date input script, something like:

but i have 2 input fields with date and i need to count number of days between input 2 and input 1.

Here is example:

Does script like that exist or i need to do is myself?

09-01-2006, 11:35 AM

needs good knowledge of the calendar script you are using
and on change events of the selects
Not sure I have the time to do this for you
but this may help.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"


<script language="JavaScript" type="text/javascript">
// Select Date (03-August-2006)
// by Vic Phillips http://www.vicsjavascripts.org.uk

// Where date selection is in the form of <SELECT> lists
// The script will populate a 'Year' <SELECT> with the years between specified years
// and the 'Month' <SELECT> with months between specified start year month and finish year month.
// Where the optional 'Day' <SELECT> is specified it will be populated with the correct number of days
// during initialisation and on an onchange event of the 'Year' or 'Month' <SELECT> lists.
// Optionally, the value of a 'text' or 'hidden' <INPUT> may be assigned the selected date.

// If the selected month, year or day matches the current month, year and day
// the current month, year and day will be selected.

// There may be as many applications on a page as required.

// **** Application Notes
// **** The HTML Code
// The <SELECT> lists must defined in the HTML Code and in a <FORM>.
// The <FORM> and <SELECT> lists must be assigned a unique name.
// The <SELECT> lists may have the first <OPTION> defined.
// e.g.
// <form name="MyForm1" >
// <select name="Day1" onchange="f70OutPut('Year1')" >
// <option >Day</option>
// </select>
// <select name="Month1" onchange="f70PopulateDay('Year1');" >
// <option >Month</option>
// </select>
// <select name="Year1" onchange="f70PopulateMonth('Year1');" >
// <option >Year</option>
// </select>
// <input type="hidden" name="OP1" >
// </form>
// The 'Year' <SELECT> lists must be assigned an onchange event call to function 'f70PopulateMonth'.
// where:
// parameter 0 = the unique name if the 'Year' <SELECT>. (string)
// Optionally, the 'Month' <SELECT> lists may be assigned an onchange event call to function 'f70PopulateDay'.
// where:
// parameter 0 = the unique name if the 'Year' <SELECT>. (string)
// Optionally, if the selected date is to be assigned as the value of a 'text' or 'hidden' <INPUT>
// the 'Day' <SELECT> lists may be assigned an onchange event call to function 'f70OutPut'.
// where:
// parameter 0 = the unique name if the 'Year' <SELECT>. (string)
// Note that the value format will be 'YYYY/MM/DD'.

// **** Auto Populating the Month <SELECT>
// An array specifying the twelve month names must be defined.
// Example:
var MonthAry1=new Array('January','February','March','April','May','June','July','August','September','October','Novem ber','December');
var MonthAry2=new Array('Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec');

// **** Initialising the Script
// Each application would normally be initialised from a <BODY> or window onload event call
// to function f70PopulateDate('MyForm1','Year1','Month1','Day1','OP1','2000/02/10','2010/11/20');
// where:
// parameter 0 = the unique name of the <FORM> object. (string)
// parameter 1 = the unique name of the Year <SELECT> object. (string)
// parameter 2 = the unique name of the Month <SELECT> object. (string)
// parameter 3 = (optional) the unique name of the Day <SELECT> object. (string or null if not required)
// parameter 4 = (optional) the unique name of textbox to display 'YYYY/MM/DD'. (string or null if not required)
// parameter 5 = the start date (yyyy/mm/dd). (string)
// parameter 6 = the finish date (yyyy/mm/dd). (string)
// parameter 7 = the array defining the month names. (array variable name)
// Note
// The global variables 'f70Year', 'f70Month' and 'f70Date' are assigned as the script is loaded
// and may be used to establish the current date
// e.g.
// f70PopulateDate('MyForm1','Year2','Month2','Day2',f70Year+'/'+f70Month+'/'+f70Date,'2011/10/15',MonthAry2);
// will not allow dates prior to the current date.

// **** General
// All variable, function etc. names are prefixed with 'f70' to minimise conflicts with other JavaScripts
// These characters may be changed to characters of choice using global find and replace
// The Functional (about 3K) is best as External JavaScripts
// Tested with IE6 and Mozilla FireFox

// **** Functional Code - NO NEED to Change

var f70ToDay=new Date();
var f70Date=f70ToDay.getDate();
var f70Month=(f70ToDay.getMonth())*1+1;
var f70Year=f70ToDay.getFullYear();

function f70PopulateDate(f70frm,f70ysel,f70msel,f70dsel,f70op,f70srt,f70fin,f70ary){
if (!window['f70SDate'+f70ysel]){
if (!f70frm){ return; }
var f70yobj=f70CkObject(f70frm[f70ysel]);
if (!f70yobj){ return; }
var f70mobj=f70CkObject(f70frm[f70msel]);
if (!f70mobj){ return; }
var f70dobj=f70CkObject(f70frm[f70dsel]);
var f70opobj=f70frm[f70op];

// 0 1 2
var f70sd=window['f70SDate'+f70ysel];
var f70year=0;
for (var f700=f70sd[4][0];f700<=f70sd[5][0];f700++){
if (f700==f70Year){ f70year=f70sd[0].options.length; }
f70sd[0].options[f70sd[0].options.length]=new Option(f700,f700,true,true);

function f70PopulateMonth(f70ysel){
var f70sd=window['f70SDate'+f70ysel];
if (!f70sd){ return; }
if (!f70sd[1]){ return; }
if (f70sd[6].length!=12){ return; }
var f70month=0;
var f70srt=0;
var f70fin=f70sd[6].length
if (f70sd[0].value==f70sd[4][0]){ f70srt=parseInt(f70sd[4][1])-1; }
if (f70sd[0].value==f70sd[5][0]){ f70fin=parseInt(f70sd[5][1]); }
for (var f700=f70srt;f700<f70fin;f700++){
if (f700==f70Month-1){ f70month=f70sd[1][0].options.length; }
f70sd[1][0].options[f700+f70sd[1][1]-f70srt]=new Option(f70sd[6][f700],f700,true,true);
if (f70sd[2][0]){ f70PopulateDay(f70ysel); }

function f70PopulateDay(f70ysel){
var f70sd=window['f70SDate'+f70ysel];
if (!f70sd){ return; }
if (!f70sd[2][0]){ return; }
var f70srt=1;
var f70fin;
if (f70month.length<1||f70year.length<1||isNaN(f70month)||isNaN(f70year)){ f70fin=0; }
else { f70fin=f70DinMonth(f70month*1,f70year*1); }
var f70d=f70sd[2][0].value||0;
if (f70sd[0].value==f70sd[4][0]&&f70sd[1][0].value==f70sd[4][1]-1){ f70srt=parseInt(f70sd[4][2]); }
if (f70sd[0].value==f70sd[5][0]&&f70sd[1][0].value==f70sd[5][1]-1){ f70fin=parseInt(f70sd[5][2]); }
for (var f700=f70srt;f700<=f70fin;f700++){
if (f700==f70Date&&f70month==f70Month-1&&f70year==f70Year){ f70d=f700+f70sd[2][1]-f70srt; }
f70sd[2][0].options[f700+f70sd[2][1]-f70srt]=new Option(f700<10?'0'+f700:f700,f700,true,true);
if (f70sd[3]){ f70OutPut(f70ysel); }

function f70OutPut(f70ysel){
var f70sd=window['f70SDate'+f70ysel];
if (!f70sd[3]){ return; }

function f70FormatNu(zxcnu){
return (zxcnu<10)?'0'+zxcnu:zxcnu;

function f70CkObject(f70obj,f70tag){
if (!f70obj){ return false; }
if (f70obj.tagName.toUpperCase()!=(f70tag||'SELECT')){ return false; }
return f70obj;

function f70DinMonth(f70m,f70y){
var f70ds=new Date(f70y,f70m+1,1,-1).getDate();
return f70ds;

<script language="JavaScript" type="text/javascript">
function Days(frm){
var date1=new Date(frm.Year1.value,frm.Month1.value,frm.Day1.value);
var date2=new Date(frm.Year2.value,frm.Month2.value,frm.Day2.value);
alert(((date2-date1)/1000/60/60/24)+' Days');



<form name="MyForm1" >
<select class="TxtArea" name="Day1" onchange="f70OutPut('Year1')" >
<option >Day</option>
<select class="TxtArea" name="Month1" onchange="f70PopulateDay('Year1');" >
<option >Month</option>
<select class="TxtArea" name="Year1" onchange="f70PopulateMonth('Year1');" >
<option >Year</option>
<input name="OP1" size="10" > normally 'hidden'
<select class="TxtArea" name="Day2" >
<option >Day</option>
<select class="TxtArea" name="Month2" onchange="f70PopulateDay('Year2');" >
<option >Month</option>
<select class="TxtArea" name="Year2" onchange="f70PopulateMonth('Year2');" >
<option >Year</option>
<input type="button" name="" value="Days" onclick="Days(this.form);">




09-01-2006, 12:06 PM
Thanks, i will see.

I'm using this script:

09-01-2006, 02:03 PM
I'am not willing to update that script but have updated one of my own


09-01-2006, 02:27 PM
I have posted that link just to see if anybody did work with it, you don't need to do anything :)

Your script is something that i need, thanks.

11-20-2006, 10:15 PM
Nice script and very simple.


EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum