.dsy:it. - [PHP HTML]date in form

.dsy:it. (http://www.dsy.it/forum/)
- Tech (http://www.dsy.it/forum/forumdisplay.php?forumid=189)
-- [PHP HTML]date in form (http://www.dsy.it/forum/showthread.php?threadid=26400)

Posted by maynard80 on 03-07-2006 15:52:

date in form

avete presente quano dovete immettere una data in una form e compare una finstrella dove potete scegliere una data? (tipo agenda o sito di prenotazione alberghi e aerei) come si fa?

ad esempio
http://travelonline.edreams.it/travelonline/index.jhtml

__________________
msn Messenger: giamma80 at tiscali.it
ATHENA !

Posted by Skilotto83 on 03-07-2006 16:06:

in .NET c'è l'oggetto DateTimePicker che fa esattamente quello..

__________________
"Why, Sir, you find no man at all intellectual who is willing to leave London.
No, Sir, when a man is tired of London, he is tired of life; for there is in London all that life can afford."
(DR SAMUEL JOHNSON 1777)

MSN andrea.poretti(at)hotmail.it

Posted by maynard80 on 03-07-2006 16:11:

Originally posted by Skilotto83
in .NET c'è l'oggetto DateTimePicker che fa esattamente quello..

eh eh bello il .NET , ma per ora mi devo arrangiare con html, javascript e PHP

__________________
msn Messenger: giamma80 at tiscali.it
ATHENA !

Posted by Gusher on 03-07-2006 16:22:

Originally posted by maynard80
eh eh bello il .NET , ma per ora mi devo arrangiare con html, javascript e PHP

http://www.dynarch.com/projects/calendar

Posted by deadMe on 07-07-2006 10:42:

io uso questo java script:

code:
<HTML>
<HEAD>
<TITLE> Calendar </TITLE>
<style type="text/css">

#id1{cursor: hand}

</style>

</HEAD>
<BODY>
<script language="JavaScript">

//Form button calendar (author unknown)
//For this script and more
//Visit http://wsabstract.com

function setDate(str) {
// la lunghezza è comparata = a 3 perchè la stringa è composta da 
// 3 caratteri, infatti da codice passo ad esempio: " 1 " prova a contare i caratteri
// sono proprio tre.
if (str.length ==3) { str = '0'+str  
					 } 

 if (str == "   ") {
  return;
 }

 mnth1 = document.forms[0].month.value;
 mnth = mnth1;
 mnth++;

 year = document.forms[0].year.value;

mnth= mnth.toString();
//qui invece la lunghezza è comparata con uno perchè ho convertito un numero in stringa e
// la sua lughezza è di uno.
if (mnth.length==1) { mnth= 0+mnth };
	str = str.toString();
if (str.length == 1) { str = '0' + str };
 dateStr = mnth+"/"+str+"/"+year;
 dateStr = trim(dateStr);
 document.forms[1].dateField.value = dateStr;
}//setDate()

/**
 * The function removes spaces from the selected date.
 */

function trim(str) {

 res="";

 for(var i=0; i< str.length; i++) {
   if (str.charAt(i) != " ") {
     res +=str.charAt(i);
  }
 }
   
 return res;

}//trim()
 
/**
 * The method to get the Month name given the Month number of the year.
 */

function getMonthName(mnth) {

 if (mnth == 0) {
  name = "January";
 }else if(mnth==01) {
  name = "February";
 }else if(mnth==02) {
  name = "March";
 }else if(mnth==03) {
  name = "April";
 }else if(mnth==04) {
  name = "May";
 } else if(mnth==05) {
  name = "June";
 } else if(mnth==06) {
  name = "July";
 } else if(mnth==07) {
  name = "August";
 } else if(mnth==08) {
  name = "September";
 } else if(mnth==09) {
  name = "October";
 } else if(mnth==10) {
  name = "November";
 } else if(mnth==11) {
  name = "December";
 }

 return name; 

}//getMonthName()

/**
 * Get the number of days in the month based on the year.
 */

function getNoOfDaysInMnth(mnth,yr) {
 
 rem = yr % 4;

 if(rem ==0) {
   leap = 1;
 } else {
  leap = 0;
 }

 noDays=0;

 if ( (mnth == 01) || (mnth == 03) || (mnth == 05) ||
      (mnth == 07) || (mnth == 08) || (mnth == 10) ||
      (mnth == 12)) {
  noDays=31;
 } else if (mnth == 02) {
           noDays=28+leap;
        } else {
           noDays=30;
 }

 //alert(noDays);
 return noDays;
 
      
}//getNoOfDaysInMnth()
  
/**
 * The function to reset the date values in the buttons of the 
 * slots.
 */

function fillDates(dayOfWeek1,noOfDaysInmnth) {

 for(var i=1; i<43; i++) {
   str = "s"+i;
   document.forms[0].elements[str].value="   ";
 }


 startSlotIndx = dayOfWeek1;
 slotIndx = startSlotIndx;

 for(var i=1; i<(noOfDaysInmnth+1); i++) {
  slotName = "s"+slotIndx;

  val="";
  if (i<10) {
    val = " "+i+" ";
  } else {
    val = i;
  }
  document.forms[0].elements[slotName].value =  val;
  slotIndx++;
 }
  
}//fillDates()
 

/**
 * The function that is called at the time of loading the page.
 * This function displays Today's date and also displays the 
 * the calendar of the current month.
 */

function thisMonth() {


  dt = new Date();
//alert('date='+dt)
  mnth  =  dt.getMonth(); /* 0-11*/
//alert('mese='+mnt)
  dayOfMnth = dt.getDate(); /* 1-31*/
  dayOfWeek = dt.getDay(); /*0-6*/
  yr = dt.getFullYear(); /*4-digit year*/

 // alert(dayOfWeek);
if (dayOfMnth  )
  mnthName = getMonthName(mnth)+ " ";

  document.forms[0].month.value = mnth;
  document.forms[0].year.value = yr;
  document.forms[0].currMonth.value = mnth;
  document.forms[0].currYear.value = yr;
  document.forms[0].monthYear.value = mnthName+yr;
  dayOfMnth = dayOfMnth.toString();
  mnth = (mnth+1)
  mnth = mnth.toString();
  if (dayOfMnth.length == 1) {dayOfMnth = '0' + dayOfMnth}
  if (mnth.length == 1) {mnth = '0' + mnth}
  document.forms[1].dateField.value =(mnth)+"/"+dayOfMnth+"/"+yr;
	startStr = (mnth+1)+"/1/"+yr;

  dt1 = new Date(startStr);
  dayOfWeek1 = dt1.getDay(); /*0-6*/
	noOfDaysInMnth = getNoOfDaysInMnth(mnth,yr);
  fillDates(dayOfWeek1+1,noOfDaysInMnth);
	
  nextMonth();
  prevMonth();

}//thisMonth()

/**
 * The function that will be used to display the calendar of the next month.
 */

function nextMonth() {

 var currMnth = document.forms[0].month.value;
 currYr = document.forms[0].year.value;

 if (currMnth == "11") {
    nextMnth = 0;
    nextYr = currYr;
    nextYr++;
 } else {
   nextMnth=currMnth;
   nextMnth++;
   nextYr = currYr;
 }

 mnthName = getMonthName(nextMnth);
 document.forms[0].month.value=nextMnth;
 document.forms[0].year.value=nextYr;
 document.forms[0].monthYear.value= mnthName+" "+nextYr;

 str = (nextMnth+1)+"/1/"+nextYr;
 dt = new Date(str);
 dayOfWeek = dt.getDay();

 noOfDays = getNoOfDaysInMnth(nextMnth+1,nextYr);

 fillDates(dayOfWeek+1,noOfDays);
 

}//nextMonth()

/**
 * The method to display the calendar of the previous month.
 */

function prevMonth() {

 var currMnth = document.forms[0].month.value;
 currYr = document.forms[0].year.value;

 if (currMnth == "0") {
    prevMnth = 11;
    prevYr = currYr;
    prevYr--;
 } else {
   prevMnth=currMnth;
   prevMnth--;
   prevYr = currYr;
 }

 str = (prevMnth+1)+"/1/"+prevYr;
 dt = new Date(str);
 dayOfWeek = dt.getDay();

 /***********************************************
  * Remove the comment if do not want the user to 
  * go to any previous month than this current month.
  ***********************************************/

 /*

 runningMonth = document.forms[0].currMonth.value;
 rMonth=runningMonth;
 rMonth++;
 runningYear = document.forms[0].currYear.value;
 rYear=runningYear;

 str = (rMonth)+"/1/"+rYear;
 dt1 = new Date(str);
 
 if (dt.valueOf() < dt1.valueOf()) {
   alert('Cannot Go Before Current Month');
   return;
 }
 
 */

 / **************************************************

 * End of comment
  **************************************************
/

 mnthName = getMonthName(prevMnth);
 document.forms[0].month.value=prevMnth;
 document.forms[0].year.value=prevYr;
 document.forms[0].monthYear.value= mnthName+" "+prevYr;

 noOfDays = getNoOfDaysInMnth(prevMnth+1,prevYr);
 fillDates(dayOfWeek+1,noOfDays);
 
}//prevMonth()
 
function invia (){
	window.returnValue=frmDate.dateField.value;
	window.close();
					}
</script>
</head>


<body onload="thisMonth()" BGCOLOR="#80C847">
<table border=1 bgcolor="#C3EF97" align=center>
<tr>
<td>

<form>
    <!-- Hidden fields --->

    <input type=hidden name=month value="">
    <input type=hidden name=year value="">
    <input type=hidden name=currMonth value="">
    <input type=hidden name=currYear value="">

 
    <!-- End of Hidden fields --->

    <p>
     <input type="button" name="prev" onclick="prevMonth()" 
     value="<<">
     <input type="text" size="15" name="monthYear" 
     value="">
     <input type="button" name="next" onclick="nextMonth()" value=">>">
   </p>
    
    <table bgcolor="#D4D4D4" align=center border="1" cellpadding="0" cellspacing="0" 
    width="150">
        <tr bgcolor="#10A0A0">
            <td width="14%"><font size="1"><strong>SUN</strong></font></td>
            <td width="14%"><font size="1"><strong>MON</strong></font></td>
            <td width="14%"><font size="1"><strong>TUE</strong></font></td>
            <td width="14%"><font size="1"><strong>WED</strong></font></td>
            <td width="14%"><font size="1"><strong>THU</strong></font></td>
            <td width="15%"><font size="1"><strong>FRI</strong></font></td>
            <td width="15%"><font size="1"><strong>SAT</strong></font></td>
        </tr>
        <tr>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
	    name="s1" value=" 01 "></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s2" value=" 02 "></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s3" value=" 03 "></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s4" value=" 04 "></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s5" value=" 05 "></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s6" value=" 06 "></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s7" value=" 07 "></td>
        </tr>
        <tr>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s8" value=" 08 "></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s9" value=" 09 "></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s10" value="10"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s11" value="11"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s12" value="12"></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s13" value="13"></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s14" value="14"></td>
        </tr>
        <tr>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s15" value="15"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s16" value="16"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s17" value="17"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s18" value="18"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s19" value="19"></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s20" value="20"></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s21" value="21"></td>
        </tr>
        <tr>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s22" value="22"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s23" value="23"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s24" value="24"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s25" value="25"></td>
            <td align="center" width="14%"><input type="button"
            onclick="setDate(this.value);"
            name="s26" value="26"></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s27" value="27"></td>
            <td align="center" width="15%"><input type="button"
            onclick="setDate(this.value);"
            name="s28" value="28"></td>
        </tr>
        <tr>
            <td align="center"><input type="button" name="s29"
            onclick="setDate(this.value);"
            value="29"></td>
            <td align="center"><input type="button" name="s30"
            onclick="setDate(this.value);"
            value="30"></td>
            <td align="center"><input type="button" name="s31"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s32"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s33"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s34"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s35"
            onclick="setDate(this.value);"
            value="   "></td>
        </tr>
        <tr>
            <td align="center"><input type="button" name="s36"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s37"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s38"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s39"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s40"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s41"
            onclick="setDate(this.value);"
            value="   "></td>
            <td align="center"><input type="button" name="s42"
            onclick="setDate(this.value);"
            value="   "></td>
        </tr>
    </table>
</form>
 <form name=frmDate >
<%dim tmp
	tmp = request("callingPage")%>
  <table border=0 cellspacing=1 cellpadding=1>
  <tr>
  <td>
  <b>Selected:</b>
  </td>
  <td align=center>
	<input type=text size="12" name=dateField>
  </td>
  <tr>
  </table>
 </form>
</td>
</tr>
</table>
<br>
<center><font color = blue > <a id = id1 onclick = "invia();"> <u>[OK] </u></a></font></center>

</BODY>
</HTML>

così com'è è impostato sul formato di date inglese ma ci metti un'attimo a modificarlo

__________________
"D.U.M.B. everyone's accusing me" - Pinhead

All times are GMT. The time now is 08:01.

Show all 5 posts from this thread on one page