Machen Kendo-Datepicker-readonly-aber auch wählbar

Ich habe gekämpft, um meine Kendo-Datepicker-ohne Benutzer-text-Eingabe und die einzige Lösung, die Ive kommen mit den Tags "readonly". Aber ich möchte in der Lage sein, um wählen Sie das Datum aus der Auswahl mit der Maus ohne die Möglichkeit zur Eingabe von text direkt auf die Farbauswahl, damit der datepicker-readonly-aber wählbar.

Irgendwelche Ideen, wie?

                <div>
                    @(Html.Kendo().DatePicker()
                          .Start(CalendarView.Year)
                          .Name("DatePicker")
                          .Value(DateTime.Now.AddDays(-365))
                          .Max(DateTime.Now)
                          .HtmlAttributes(new { style = "width: 125px;"  })
                          .Events(e => e.Change("onDateChange")))
                </div>
InformationsquelleAutor gardarvalur | 2013-08-19
  1. 7

    Nach einer Weile fand ich eine sehr einfache Lösung mit javascript. Ich erklärte einfach ein Skript, das verhindert, dass jeder Benutzer Eingabe ohne Deaktivierung zu machen, oder die input readonly. So etwas wie dieses:

    $("#inputId").keypress(function (evt) {
    var keycode = evt.charCode || evt.keyCode;
    if (keycode == 9) { //allow Tab through
        return true;
    } else {
        return false;
    }
});

    Es war einfacher als ich dachte 🙂

    ########### BEARBEITET ####################

    Wie schon in einem Kommentar angedeutet, ist es wahrscheinlich keine gute Praxis zu unterdrücken, alle Tastenanschläge, so werde ich die paste fast den gleichen code, aber was darauf hindeutet, dass ich den datePicker statt (aber immer noch eine Art von Unterdrückung der Benutzer die Texteingabe als auch).

    $("#inputId").keypress(function (evt) {
    var keycode = evt.charCode || evt.keyCode;
    if (keycode == 9) { //allow Tab through
        return true;
    } else {
        //Allow the datepicker to open instead
        var datePicker = $("#inputId").data("kendoDatePicker");
        datePicker.open();
        return false;
    }
});
    • Interessant, dass Kendo nicht decken diese. Ein detail, ist diese Lösung vielleicht etwas verwirrend für die user,eg. wenn Sie ein Feld auswählen, die Sie erlaubt sein sollte, geben Sie es in. Was ist mit dem öffnen der datapicker statt schlucken der Tastendruck, wenn der Benutzer versucht, zu geben.
    • Danke für deinen input @Bobby_D_. Ich fand es auch ziemlich komisch, dass Sie nicht decken, zumindest ging ich durch alle Ihrer Dokumentation, und es war nichts über die Unterdrückung von Tastatureingaben. Ich denke, man kann auf etwas, als was darauf hindeutet, um nicht zu einer Unterdrückung der Tastatureingaben auf, sondern öffnen Sie den datepicker statt. Ich aktualisiert meine Antwort zu reflektieren, nur, dass. Danke 🙂
    • Hier ist die API: demos.kendoui.com/web/datepicker/api.html
    • Aber wie verhindern Sie, dass das kopieren und einfügen über die browser-rechts-Klick-Menü?
    • Überprüfen Sie das @MylesJ : stackoverflow.com/questions/5618109/...
    InformationsquelleAutor gardarvalur
  2. 0

    Können Sie etwas wie das hier tun:

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

    wenn jemand klickt auf die datepicker-es gibt false zurück, daher nicht erlauben, nichts eingeben, während es bleibt noch wählbar.

    • Erwägen Sie eine Erklärung zusammen mit Ihrem code, um es klarer.
    • Ich habe bearbeitet es.
    • Dies ist im Grunde die gleiche Sache, nur weniger Lärm 🙂
    InformationsquelleAutor Anuj
  3. -2

    Hinzufügen maxlength Attribut 0 im HtmlAttributes.

    InformationsquelleAutor tjaddison
Schreibe einen Kommentar