Error al crear un '<Anterior' y 'Siguiente>' eslabón (fecha) para jQueryUI selector de fechas utilizando setdate

Question

Estoy intentando conectar "< anteriores" y "Siguiente>" enlaces a un control de selector de fecha jQueryUI. Mi problema es que agregará correctamente 1 día, pero luego se detendrá. No continuará agregando días. (lo mismo con el botón anterior). Entonces, si ingreso el 30/10/2009, solo será "siguiente" al 31/10/2009 y no se transferirá al 1 de noviembre. ¿Alguna idea? Aquí está mi código simplificado:

HTML relevante:

<form id="dateForm"> 
<a href="" id="previous">&laquo; Previous</a> 
<input name="datepicker" type="text" value="10/30/2009" id="datepicker" /> 
<a href="" id="next">Next &raquo;</a> 

Relevante Javascript/jQueryUI:

// Datepicker Init 
$("#datepicker").datepicker({showOn: 'button', buttonText: 'Click to choose date'}).change(function() { 
    refreshSchedule(); 
}); 

// Next Day Link 
$('a#next').click(function() { 
    $("#datepicker").datepicker('setDate', '+1'); 
    refreshSchedule(); 
    return false; 
}); 

// Previous Day Link 
$('a#previous').click(function() { 
    $("#datepicker").datepicker('setDate', '-1'); 
    refreshSchedule(); 
    return false; 
}); 

El selector de fechas jQueryUI funciona correctamente lo contrario.

Actualización por comentario: la función refreshCalendar() podría haberse llamado doSomething(); Es irrelevante para la pregunta original sobre cómo incrementar/desincrementar el campo # datepicker. Dicho eso, aquí está el código. Pude haber hecho lo mismo con un oyente $ ("# datepicker"). Change() y una función de devolución de llamada para actualizar la tabla/título.

// Get the latest calendar data from server. Update the calendar title & table 
// returns a json array: data[0] = title, data[1] = html table contents 
refreshCalendar = function() { 
    var selectedDate = $("#datepicker").val(); 
    $.getJSON(serverUrl, {targetDate: selectedDate}, function (data) { 
     $("#calendarTitle").html(data[0]); 
     $("#calendarTable").html(data[1]); 
    }); 
}; 

Answer 1

Como dice el documento para datepicker setDate le permite proporcionar una cadena de varios días a partir de hoy. Entonces eso significa $(). Datepicker ('setDate', '-1'); Siempre es igual a la fecha de hoy - 1 día, se le puede llamar 12 veces en una fila y siempre será igual a lo mismo (a menos que comience a las 11:59 pm en un día y termine 12:01a.m. la siguiente)

http://jqueryui.com/demos/datepicker/#method-setDate

lo que creo que quiere es la siguiente:

// Next Day Link 
$('a#next').click(function() { 
    var $picker = $("#datepicker"); 
    var date=new Date($picker.datepicker('getDate')); 
    date.setDate(date.getDate()+1); 
    $picker.datepicker('setDate', date); 
    return false; 
}); 

// Previous Day Link 
$('a#previous').click(function() { 
    var $picker = $("#datepicker"); 
    var date=new Date($picker.datepicker('getDate')); 
    date.setDate(date.getDate()-1); 
    $picker.datepicker('setDate', date); 
    return false; 
}); 

Answer 2

también me encontré con este recientemente y necesita para modificar la salida ligeramente - Aquí está mi jsFiddle. Tenga en cuenta que al hacer clic en el botón cuando se usa así;

<button class="prev-day">Previous</button> 

Actualizará la página que puede utilizar demasiados recursos del servidor. Para evitar eso, se puede utilizar

<button type="button" class="prev-day">Previous</button> 

y si es necesario, se puede refrescar otras funciones/datos relacionados mediante una llamada AJAX.

http://jsfiddle.net/uh26x030/1