Fehler a '<zurück' und 'weiter>' (Datum) Link für jQueryUI picker mit setdate

Question

Schaffung Ich versuche "< Zurück" und "Weiter>" Links zu einer jQueryUI picker Kontrolle zu befestigen. Mein Problem ist, dass es einen Tag richtig hinzufügen wird, aber dann aufhören. Es wird nicht mehr Tage hinzufügen. (Gleiches mit der vorherigen Schaltfläche). Also wenn ich am 30.10.2009 reinginge wird es nur "next" bis 31.10.2009, und wird nicht auf 1. November übertragen. Irgendwelche Ideen? Hier ist meine vereinfachte Code:

Relevante HTML:

<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; 
}); 

Die jQueryUI picker richtig anders funktioniert.

Update pro Kommentar - Die Funktion refrescalCalendar() könnte doSomething(); Es ist irrelevant für die ursprüngliche Frage, wie das #datepicker-Feld inkrementiert/dekrementiert wird. Das heißt, hier ist der Code. Ich hätte das Gleiche mit einem $ ("# datepicker"). Change() - Listener und einer Callback-Funktion machen können, um die Tabelle/den Titel zu aktualisieren.

// 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

Da die Dokumentation für den Datepicker setDate sagen können Sie eine Zeichenfolge aus einer Anzahl von Tagen von heute bieten. Das bedeutet $(). Datepicker ('setDate', '-1'); Immer gleich heutige Datum - vor 1 Tag, Sie feststellen, dass 12-mal in Folge nennen kann, und es wird immer gleich die gleiche Sache (es sei denn Sie um 11:59 Uhr an einem Tag beginnen und enden 12.01 am nächsten)

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

Was ich denke, Sie wollen, ist dies:

// 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

ich über diese auch vor kurzem kam und notwendig, um die Ausgabe etwas zu ändern - hier mein jsfiddle ist. Beachten Sie, dass beim Klicken auf die Schaltfläche, wenn Sie so verwendet werden;

Aktualisiert die Seite, die möglicherweise zu viel Server-Ressource verwendet. Um zu verhindern, dass können Sie

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

verwenden und wenn Sie benötigen, können Sie andere ähnliche Funktion/Daten über AJAX-Aufruf aktualisieren.

http://jsfiddle.net/uh26x030/1