Kendo UI Datepicker Deaktivieren Eingabe

Ich möchte Benutzer in der Lage sein, einen Kendoo UI Datepicker Wert nur über seine Schaltfläche ändern und wählen Sie das Datum aus dem Pop-up. Wie kann ich verhindern, dass Benutzer die Datepicker-Textbox eingeben? Kann ich das Textfeld deaktivieren, ohne das gesamte Steuerelement zu deaktivieren?Kendo UI Datepicker Deaktivieren Eingabe

Quelle

2013-07-02 Pejman

Finden Sie Ihr Eingabeelement, und deaktivieren Sie es

$('#datepicker').attr('disabled','disabled');

(versuchte es auf der Kendo-Demo Website http://demos.kendoui.com/web/datepicker/index.html)

Quelle

2013-07-03 07:06:19 AntouanK

dies funktioniert, aber wenn die Eingabe eine Datenbindung = "disabled: XXX" dann funktioniert es nicht aus irgendeinem Grund – xinthose

Ich hatte das gleiche Problem, und war in der Lage, es zu arbeiten, wenn Sie eine 'daten- bind = "disabled: XXX" 'durch Bindung an das change-Ereignis des Viewmodels und in dieser gebundenen Funktion, die das Attribut auf" disabled "setzt, wenn sich die Daten des Viewmodels ändern. –

Wenn Sie Benutzer eingeben Datum Datumsauswahl und nur ausgewähltes Datum aus Pop verhindern wollen -Bis diesen Code versuchen

$(".k-datepicker").find('span').find('input').attr("readonly", "readonly");

Quelle

2013-07-03 07:17:29 Jaimin

das ist perfekt – a0z0ra

natürlich sollte das Datum und die Uhrzeit Picker Widget die Möglichkeit haben, die Eingabe mit UI nur zu zwingen, und nicht durch ke yboard ... Ansonsten ist es ein Rezept für einen echten DateTime-Albtraum! Ich bin ziemlich überrascht, dass das Framework für diesen offensichtlichen Anwendungsfall nichts bietet.

hatte ich das gleiche Bedürfnis und bekam es mit der folgenden Logik zu arbeiten:

$("#date").kendoDatePicker({ 
    format: "dd MMMM yyyy" 
}); 
$("#date").attr("readonly","readonly");

So kann der Benutzer einen Wert von Tastatur nicht eingeben und kann nur Eingang ein gut formated Datums auf die Dropdown-Datum Auswahlfenster mit .

Quelle

2013-07-13 04:15:03 Tuthmosis

Auf dem Eingabeelement hinzufügen, um dieses Attribut und Wert ...

onkeydown="return false;"

Dies wird getippt Eingang deaktivieren und immer noch erlauben, den Kalender Steuereingang verwendet wird.

Quelle

2013-09-16 19:24:38

einzige Lösung, die ich gut mit angularjs Integration arbeiten kann ...Danke – simpleusr

Sie können es tun, indem Sie zwei Möglichkeiten

//disable kendo ui datapicker click event 
    $(".k-datepicker input").bind('click dblclick',function() { 
     return false; 
    }); 

    //make it readonly 
    $(".k-datepicker input").prop("readonly", true);

Quelle

2013-12-09 10:45:53 amol

Ich denke, die erste Option wird nicht verhindern, dass der Benutzer das Steuerelement durch Drücken von TAB erreichen. – Andrew

Verwenden Sie die Steuerung als unten-

@(Html.Kendo().DatePicker() 
.Name("FromDate") 
.HtmlAttributes(onkeydown="javascript:return false;" }) 
    )

Es Tastatur tippen deaktivieren wird. Gleichermaßen können auch andere Bedingungen gehandhabt werden.

Quelle

2014-09-10 08:57:32

Das funktioniert gut, obwohl die Syntax folgendermaßen lauten sollte: .HtmlAttributes (neu {onkeydown = "javascript: return false;"}) – iandayman

Hervorragende Problemumgehung: D thanks! –

In der Tat schränkt das Widget den Benutzer beim Eingeben der Eingabe nicht ein. Der Grund für dieses Verhalten wird hier erläutert:

Zusammen mit allen anderen in diesem Thread freigegebenen Lösungen kann der Benutzer einen benutzerdefinierten maskierten DatePicker erstellen, der den Benutzer auf ein bestimmtes Datumsformat beschränkt. Überprüfen Sie diese Anleitungen, um weitere Details Demo:

Create Date Masking

** Beachten Sie, dass dies nicht von Kendo UI als eine integrierte Funktion unterstützt wird, daher müssen Sie es auf Ihr eigenes Risiko verwenden. Die gute Nachricht ist, dass es ohne bekannte Nebenwirkungen ziemlich gut funktioniert.

Quelle

2016-06-24 08:04:35

Kendo UI Datepicker Deaktivieren Eingabe

Antwort

Verwandte Themen