jQuery Date Picker wo Texteingabe ist nur lesbar

Question

Ich möchte den Jquery Datepicker verwenden. Ich habe es mit einer Altfeldoption eingerichtet. Ich zeige D/M/Y im Textfeld an, gebe aber Y-M-D ein. Alles funktioniert soweit, das Senden der richtigen Daten usw.

Ich möchte jedoch verhindern, dass der Benutzer ein Datum manuell eingeben kann. Ich hatte ursprünglich das INPUT-Feld auf deaktiviert eingestellt, was in jedem Browser außer IE funktionierte. In IE würde es die Datumsauswahl öffnen, aber nicht nach dem Klicken auf ein Datum schließen.

Kennt jemand den besten Weg, dies zu tun?

Answer 1

Um den Benutzer von manuellem Bearbeiten der Eingabe zu vermeiden, würde ich ein Tastendruck-Ereignis und return false/verhindern Standard anhänge davon Handler ist. Auf diese Weise kann er, wenn er Javascript hat, den Datepicker verwenden, und wenn nicht, kann er die Eingabe manuell bearbeiten.

$("#input-id").keypress(function (e) 
{ 
    e.preventDefault(); 
}); 

Answer 2

Nachdem Sie das Eingabefeld deaktiviert haben, verwenden Sie die Methode destroy, um den Datumsauswahlpunkt zu entfernen. Wenn Sie das Feld erneut aktivieren, erstellen Sie den Datapicker erneut neu.

$("#target").datepicker("destroy"); 

Answer 3

Erweiterung nc3b Antwort:

$("#input-id").keydown(function (e) 
{e.preventDefault();}); 

werden Tasten wie Backspace verhindern, löschen usw. Andernfalls könnten Sie ein Datum wie 11.11.2012 haben und ein Benutzer ein Zeichen zurückzugehen könnte es zu 11.11.201 und technisch gesehen ist das immer noch ein gültiges Datum nach JS.

Answer 4

Sie können dies auch tun:

<input type="text" id="datepicker" name="datepicker" readonly="readonly" /> 

Siehe readonly oben Attribut.

Wenn Sie auch der Kalender angezeigt werden sollen, wenn die <input> Fokus hat, fügen Sie diese:

$("#datepicker").datepicker({ showOn: 'both' });