Tengo 2 JQuery campos de Fecha

  1. Llegada
  2. Salida

De la fecha de llegada no debe ser la fecha de hoy – tengo este ordenan mediante minDate: 1 en el javascript

La fecha de Salida debe ser siempre un mínimo de 2 días antes de la fecha de llegada. pensé minDate: 3 que trabajar, pero eso es la consulta de la fecha de hoy. funciona bien si el usuario elige mañana de la fecha en la llegada de campo, pero si el usuario selecciona una fecha de llegada, en el futuro, en el que se rompe. Necesito la fecha de salida para hacer referencia a la fecha de llegada y mover 2 días de antelación como mínimo a la fecha, el usuario puede escoger, esencialmente cuando la reserva en este hotel el usuario no puede quedarse por una noche, 2 noches min es necesario.

por último también tengo que calcular el número de días entre la fecha de llegada y fecha de salida en un 3er campo de texto. así que cuando la fecha de salida es introducido automáticamente entradas número de noches en el 3er campo de texto. Yo también necesito que funciona a la inversa, si un usuario decide poner en el número de noches necesito la fecha de salida para cambiar en consecuencia.

InformationsquelleAutor | 2009-08-11

3 Comentarios

  1. 8

    Estoy seguro de que este ejemplo no es perfecto, pero he aquí una demo con la mayoría de lo que usted requiere, utilizando sólo jQuery y la jQuery UI Datepicker:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Datepicker &amp; Difference</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7/themes/redmond/jquery-ui.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7/jquery-ui.min.js"></script>
<script type="text/javascript">
var DatePicked = function() {
var departure = $("#departure");
var arrival = $("#arrival");
var nights = $("#nights");
var triggeringElement = $(this);
var departureDate = departure.datepicker("getDate");
var minArrivalDate = new Date();
if (departureDate != null) {
minArrivalDate.setDate(departureDate.getDate() + 2);
} else {
minArrivalDate.setDate(minArrivalDate.getDate() + 1);
}
arrival.datepicker('option', 'minDate', minArrivalDate);
var arrivalDate = arrival.datepicker("getDate");
if (departureDate != null && arrivalDate != null && triggeringElement.attr("id") != "nights") {
var oneDay = 1000*60*60*24;
var difference = Math.ceil((arrivalDate.getTime() - departureDate.getTime()) / oneDay);
nights.val(difference);
} else if (departureDate != null && triggeringElement.attr("id") == "nights") {
var nightsEntered = parseInt(nights.val());
if (nightsEntered >= 2) {
var newArrivalDate = new Date();
newArrivalDate.setDate(departureDate.getDate() + nightsEntered);
arrival.datepicker("setDate", newArrivalDate);
} else {
alert("Nights must be greater than 2.");
}
}
}
$(function() {
$("#departure, #arrival").datepicker({
onSelect: DatePicked
});
$("#nights").change(DatePicked);
DatePicked();
});
</script>
</head>
<body>
<div>
<label for="departure">Departure</label>
<input type="text" id="departure" name="departure" />
</div>
<div>
<label for="arrival">Arrival</label>
<input type="text" id="arrival" name="arrival" />
</div>
<div>
<label for="nights">Nights</label>
<input type="text" id="nights" name="nights" />
</div>
</body>
</html>

    Jugar con eso y ver si usted puede integrar algo similar en su aplicación o sitio.

    • wow esto es perfecto! su brillante!
    • Me alegro de que trabajó para usted! Por favor marca este como la respuesta correcta si usted es feliz con ella!
    InformationsquelleAutor Jason Berry
  2. 1

    Creo que la funcionalidad de la llegada y la salida debe ser revertido/swaped. Acabo de cambiar través de las etiquetas y las cosas se convirtió en la más clara, pero ahora el código es incorrecto.

    InformationsquelleAutor
  3. 1

    cuando la fecha de salida no está fija en el mes actual, a continuación, la noche no agrega correctamente con fecha de salida.
    por ejemplo la fecha de hoy 25 de febrero .si he de poner la fecha de salida el 11 de marzo y se fija por 5 noches después de la fecha de llegada de retorno de 16 de febrero. donde tiene que ser del 16 de marzo de

    • Prestar atención a que minArrivalDate.setDate(departureDate.getDate() + 2); utilizar en el día en el mes y no a la fecha. Uso getTime() y setTime() y agregar el número de milisegundos en lugar de número de días.
    InformationsquelleAutor kabirul islam

Dejar respuesta

Please enter your comment!
Please enter your name here