Ver Mensaje Individual
  #5 (permalink)  
Antiguo 17/10/2006, 00:19
sergi_climent
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 20 años, 1 mes
Puntos: 10
entonces te posteo el codigo entero.
solo con copiarlo ya funciona...
Código PHP:
var datePickerDivID "datepicker";
var 
iFrameDivID "datepickeriframe";

var 
dayArrayShort = new Array('Do','Lu''Ma''Mi''Ju''Vi''Sa');
var 
dayArrayMed = new Array('Dom','Lun''Mar''Mie''Jue''Vie''Sab');
var 
dayArrayLong = new Array('Domingo','Lunes''Martes''Miercoles''Jueves''Viernes''Sabado');
var 
monthArrayShort = new Array('Ene''Feb''Mar''Abr''May''Jun''Jul''Ago''Sep''Oct''Nov''Dic');
var 
monthArrayMed = new Array('Ene''Feb''Mar''Abr''May''Jun''Jul''Ago''Sept''Oct''Nov''Dec');
var 
monthArrayLong = new Array('Enere''Febrero''Marzo''Abril''Mayo''Junio''Julio''Agosto''Septiembre''Octubre''Noviembre''Diciembre');
 
// these variables define the date formatting we're expecting and outputting.
// If you want to use a different format by default, change the defaultDateSeparator
// and defaultDateFormat variables either here or on your HTML page.
var defaultDateSeparator "/";        // common values would be "/" or "."
var defaultDateFormat "dmy"    // valid values are "mdy", "dmy", and "ymd"
var dateSeparator defaultDateSeparator;
var 
dateFormat defaultDateFormat;

function 
displayDatePicker(dateFieldNamedisplayBelowThisObjectdtFormatdtSep)
{
  var 
targetDateField document.getElementsByName (dateFieldName).item(0);
 
  
// if we weren't told what node to display the datepicker beneath, just display it
  // beneath the date field we're updating
  
if (!displayBelowThisObject)
    
displayBelowThisObject targetDateField;
 
  
// if a date separator character was given, update the dateSeparator variable
  
if (dtSep)
    
dateSeparator dtSep;
  else
    
dateSeparator defaultDateSeparator;
 
  
// if a date format was given, update the dateFormat variable
  
if (dtFormat)
    
dateFormat dtFormat;
  else
    
dateFormat defaultDateFormat;
 
  var 
displayBelowThisObject.offsetLeft;
  var 
displayBelowThisObject.offsetTop displayBelowThisObject.offsetHeight ;
 
  
// deal with elements inside tables and such
  
var parent displayBelowThisObject;
  while (
parent.offsetParent) {
    
parent parent.offsetParent;
    
+= parent.offsetLeft;
    
+= parent.offsetTop ;
  }
 
  
drawDatePicker(targetDateFieldxy);
}
function 
drawDatePicker(targetDateFieldxy)
{
  var 
dt getFieldDate(targetDateField.value );
 
  
// the datepicker table will be drawn inside of a <div> with an ID defined by the
  // global datePickerDivID variable. If such a div doesn't yet exist on the HTML
  // document we're working with, add one.
  
if (!document.getElementById(datePickerDivID)) {
    
// don't use innerHTML to update the body, because it can cause global variables
    // that are currently pointing to objects on the page to have bad references
    //document.body.innerHTML += "<div id='" + datePickerDivID + "' class='dpDiv'></div>";
    
var newNode document.createElement("div");
    
newNode.setAttribute("id"datePickerDivID);
    
newNode.setAttribute("class""dpDiv");
    
newNode.setAttribute("style""visibility: hidden;");
    
document.body.appendChild(newNode);
  }
 
  
// move the datepicker div to the proper x,y coordinate and toggle the visiblity
  
var pickerDiv document.getElementById(datePickerDivID);
  
pickerDiv.style.position "absolute";
  
pickerDiv.style.left "px";
  
pickerDiv.style.top "px";
  
pickerDiv.style.visibility = (pickerDiv.style.visibility == "visible" "hidden" "visible");
  
pickerDiv.style.display = (pickerDiv.style.display == "block" "none" "block");
  
pickerDiv.style.zIndex 10000;
 
  
// draw the datepicker table
  
refreshDatePicker(targetDateField.namedt.getFullYear(), dt.getMonth(), dt.getDate());
}

/**
This is the function that actually draws the datepicker calendar.
*/
function refreshDatePicker(dateFieldNameyearmonthday)
{
  
// if no arguments are passed, use today's date; otherwise, month and year
  // are required (if a day is passed, it will be highlighted later)
  
var thisDay = new Date();
 
  if ((
month >= 0) && (year 0)) {
    
thisDay = new Date(yearmonth1);
  } else {
    
day thisDay.getDate();
    
thisDay.setDate(1);
  }
 
  
// the calendar will be drawn as a table
  // you can customize the table elements with a global CSS style sheet,
  // or by hardcoding style and formatting elements below
  
var crlf "\r\n";
  var 
TABLE "<table cols=7 class='dpTable'>" crlf;
  var 
xTABLE "</table>" crlf;
  var 
TR "<tr class='dpTR'>";
  var 
TR_title "<tr class='dpTitleTR'>";
  var 
TR_days "<tr class='dpDayTR'>";
  var 
TR_todaybutton "<tr class='dpTodayButtonTR'>";
  var 
xTR "</tr>" crlf;
  var 
TD "<td class='dpTD' onMouseOut='this.className=\"dpTD\";' onMouseOver=' this.className=\"dpTDHover\";' ";    // leave this tag open, because we'll be adding an onClick event
  
var TD_title "<td colspan=5 class='dpTitleTD'>";
  var 
TD_buttons "<td class='dpButtonTD'>";
  var 
TD_todaybutton "<td colspan=7 class='dpTodayButtonTD'>";
  var 
TD_days "<td class='dpDayTD'>";
  var 
TD_selected "<td class='dpDayHighlightTD' onMouseOut='this.className=\"dpDayHighlightTD\";' onMouseOver='this.className=\"dpTDHover\";' ";    // leave this tag open, because we'll be adding an onClick event
  
var xTD "</td>" crlf;
  var 
DIV_title "<div class='dpTitleText'>";
  var 
DIV_selected "<div class='dpDayHighlight'>";
  var 
xDIV "</div>";
 
  
// start generating the code for the calendar table
  
var html TABLE;
 
  
// this is the title bar, which displays the month and the buttons to
  // go back to a previous month or forward to the next month
  
html += TR_title;
  
html += TD_buttons getButtonCode(dateFieldNamethisDay, -1"&lt;") + xTD;
  
html += TD_title DIV_title monthArrayLongthisDay.getMonth()] + " " thisDay.getFullYear() + xDIV xTD;
  
html += TD_buttons getButtonCode(dateFieldNamethisDay1"&gt;") + xTD;
  
html += xTR;
 
  
// this is the row that indicates which day of the week we're on
  
html += TR_days;
  for(
0dayArrayShort.lengthi++)
    
html += TD_days dayArrayShort[i] + xTD;
  
html += xTR;
 
  
// now we'll start populating the table with days of the month
  
html += TR;
 
  
// first, the leading blanks
  
for (0thisDay.getDay(); i++)
    
html += TD "&nbsp;" xTD;
 
  
// now, the days of the month
  
do {
    
dayNum thisDay.getDate();
    
TD_onclick " onclick=\"updateDateField('" dateFieldName "', '" getDateString(thisDay) + "');\">";
    
    if (
dayNum == day)
      
html += TD_selected TD_onclick DIV_selected dayNum xDIV xTD;
    else
      
html += TD TD_onclick dayNum xTD;
    
    
// if this is a Saturday, start a new row
    
if (thisDay.getDay() == 6)
      
html += xTR TR;
    
    
// increment the day
    
thisDay.setDate(thisDay.getDate() + 1);
  } while (
thisDay.getDate() > 1)
 
  
// fill in any trailing blanks
  
if (thisDay.getDay() > 0) {
    for (
6thisDay.getDay(); i--)
      
html += TD "&nbsp;" xTD;
  }
  
html += xTR;
 
  
// add a button to allow the user to easily return to today, or close the calendar
  
var today = new Date();
  var 
todayString "Today is " dayArrayMed[today.getDay()] + ", " monthArrayMedtoday.getMonth()] + " " today.getDate();
  
html += TR_todaybutton TD_todaybutton;
  
html += "<button class='dpTodayButton' onClick='updateDateField(\"" dateFieldName "\");'>Cerrar</button>";
  
html += xTD xTR;
 
  
// and finally, close the table
  
html += xTABLE;
 
  
document.getElementById(datePickerDivID).innerHTML html;
  
// add an "iFrame shim" to allow the datepicker to display above selection lists
  
adjustiFrame();

y sigue en el siguiente...
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier