Ver Mensaje Individual
  #3 (permalink)  
Antiguo 29/12/2010, 06:26
jevymetal69
 
Fecha de Ingreso: marzo-2004
Mensajes: 35
Antigüedad: 20 años, 2 meses
Puntos: 0
De acuerdo Respuesta: Jquery ui DatePicker , calendarios...

Mil gracias¡¡
He podido desarrrollar lo que pretendía...
Dos select que se autoactualizan con calendarios que están vinculados por las fechas de inicio y de fín de cada select...
Os pongo el código integro para que la gente pueda probarlo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>Calendario</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href=".\estilos\blitzer\jquery-ui-1.8.7.custon.css" rel="stylesheet" type="text/css" />



<script type="text/javascript" src=".\librerias\Jquery\jquery.js"></script>
<script type="text/javascript" src=".\librerias\Jquery\jquery.ui.core.js"></script>
<script type="text/javascript" src=".\librerias\Jquery\jquery.ui.widget.js"></script>
<script type="text/javascript" src=".\librerias\Jquery\jquery.ui.datepicker.js"></script>
<script type="text/javascript" src=".\librerias\Jquery\ui.datepicker-es.js"></script>
<script type="text/javascript" src=".\librerias\date.js"></script>



<script>

var FechaDesde;
var FechaHasta;
var mes;
var dia;
var ano;

function readSelected() {
fecha1();
$("#selectedDatepicker" ).datepicker( "option", "minDate", new Date(ano, mes - 1, dia) );
//$('#selectedDatepicker').val(dia + '/' + mes + '/' + ano);
return {};
}
function readSelected2() {
fecha2();
$("#selectedDatepicker2" ).datepicker( "option", "minDate", new Date(ano, mes - 1, dia) );
$('#selectedDatepicker2').val(dia + '/' + mes + '/' + ano);
return {};
}


function updateSelected(date) {

$('#selectDay').val(date.substring(0, 2));
$('#selectMonth').val(date.substring(3, 5));
$('#selectYear').val(date.substring(6, 10));

$('#selectDay2').val(date.substring(0, 2));
$('#selectMonth2').val(date.substring(3, 5));
$('#selectYear2').val(date.substring(6, 10));
}
function updateSelected2(date) {

$('#selectDay2').val(date.substring(0, 2));
$('#selectMonth2').val(date.substring(3, 5));
$('#selectYear2').val(date.substring(6, 10));
}
function fecha1()
{
mes = document.getElementById("selectMonth").value;
dia = document.getElementById("selectDay").value;
ano = document.getElementById("selectYear").value;

}

function fecha2()
{
mes = document.getElementById("selectMonth2").value;
dia = document.getElementById("selectDay2").value;
ano = document.getElementById("selectYear2").value;


}

function muestra()
{


$('#selectedDatepicker').datepicker({
beforeShow: readSelected,
onSelect: updateSelected,
//minDate: Date.parse('today'),
changeMonth: true,
changeYear: true,
showOn: 'both', buttonImageOnly: true, buttonImage: 'Calendar.gif'});

$('#selectedDatepicker2').datepicker({
beforeShow: readSelected2,
onSelect: updateSelected2,
//minDate: Date.parse('t + 1d'),
changeMonth: true,
changeYear: true,
showOn: 'both', buttonImageOnly: true, buttonImage: 'Calendar.gif'});





}


</script>

</head>
<body onload="muestra()">

<form name="prueba" >


<table>
<tr>
<td>
<select id="selectMonth" onBlur=""><option value="01">Enero</option><option value="02">Febrero</option>
<option value="03">Marzo</option><option value="04">Abril</option><option value="04">Abril</option>
<option value="05">Mayo</option><option value="06">Junio</option><option value="07">Julio</option>
<option value="08">Agosto</option><option value="09">Septiembre</option><option value="10">Octubre</option>
<option value="11">Noviembre</option><option value="12">Diciembre</option>...
</select>
<select id="selectDay">
<option value="01">1</option><option value="02">2</option>
<option value="03">3</option><option value="04">4</option>
<option value="05">5</option><option value="06">6</option>
<option value="07">7</option><option value="08">8</option>
<option value="09">9</option><option value="10">10</option>
<option value="11">11</option><option value="12">12</option>
<option value="13">13</option><option value="14">14</option>
<option value="15">15</option><option value="16">16</option>
<option value="17">17</option><option value="18">18</option>
<option value="19">19</option><option value="20">20</option>
<option value="21">21</option><option value="22">22</option>
<option value="23">23</option><option value="24">24</option>
<option value="25">25</option><option value="25">25</option>
<option value="26">26</option><option value="27">27</option>
<option value="28">28</option><option value="29">29</option>
<option value="30">30</option><option value="31">31</option>
</select>
<select id="selectYear">
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
</select>
<input type="hidden" disabled="disabled" id="selectedDatepicker" size="10">
</td>
</tr>
<tr>
<td>
<select id="selectMonth2" onBlur=""><option value="01">Enero</option><option value="02">Febrero</option>
<option value="03">Marzo</option><option value="04">Abril</option><option value="04">Abril</option>
<option value="05">Mayo</option><option value="06">Junio</option><option value="07">Julio</option>
<option value="08">Agosto</option><option value="09">Septiembre</option><option value="10">Octubre</option>
<option value="11">Noviembre</option><option value="12">Diciembre</option>...
</select>
<select id="selectDay2">
<option value="01">1</option><option value="02">2</option>
<option value="03">3</option><option value="04">4</option>
<option value="05">5</option><option value="06">6</option>
<option value="07">7</option><option value="08">8</option>
<option value="09">9</option><option value="10">10</option>
<option value="11">11</option><option value="12">12</option>
<option value="13">13</option><option value="14">14</option>
<option value="15">15</option><option value="16">16</option>
<option value="17">17</option><option value="18">18</option>
<option value="19">19</option><option value="20">20</option>
<option value="21">21</option><option value="22">22</option>
<option value="23">23</option><option value="24">24</option>
<option value="25">25</option><option value="25">25</option>
<option value="26">26</option><option value="27">27</option>
<option value="28">28</option><option value="29">29</option>
<option value="30">30</option><option value="31">31</option>
</select>
<select id="selectYear2">
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
</select>
<input type="hidden" disabled="disabled" id="selectedDatepicker2" size="10">
</td>
</tr>
<table>




</form>
</body>
</html>