2013-07-25 12 views
5

Hallo Ich habe eine Kendo Vorlage und diese Vorlage enthält eine Textbox wie unten mit datetime Picker.Wie setze ich min Datum für Kendo Datetime Picker

<script id="popup_editor" type="text/x-kendo-template"> 
    <input data-role="datepicker" data-bind="value: datePickerValue" /> 
</script> 

Jetzt möchte ich min Wert für diese festlegen. Ich möchte nicht erlauben, vorherige Tage als heute auszuwählen.

Jedes Beispiel?

Antwort

2

Normalerweise, können Sie einige Javascript tun hier:

var myDatePicker = $("#date").kendoDatePicker().data("kendoDatePicker"); 
myDatePicker.min(new Date()); 

aber ich bin nicht sicher, ob es in Ihrer Vorlage, die Art und Weise funktionieren wird. Vielleicht ist es ein Anfang.

+0

es ist nicht mit Vorlagen – jestges

5

Versuchen Sie, diese

var myDatePicker = $("#myDatePicker").kendoDatePicker().data("kendoDatePicker"); 
var today = new Date(); 
var day = today.getDate(); 
var month = today.getMonth() + 1; 
var year = today.getFullYear(); 
myDatePicker.min(new Date(year,month,day)); 
+0

arbeiten, werden sie unabhängig arbeiten .. aber ich bin in meiner Vorlage wie oben Code – jestges

+1

Kendo bietet viele Datum Helfer mit picker. Sie können einfach 'kendo.date.today()' aufrufen, um das aktuelle Datum als JavaScript-Objekt zu erhalten. Hinweis: Ich glaube, dass dieser Helfer in Q2 2013 hinzugefügt wurde. –

2

Ok ich etwas ähnliches implementieren musste vor kurzem und fand eine einfache Möglichkeit, dies zu tun. Mir ist klar, dass das viel zu spät ist, aber ich habe diese Frage während meiner Recherche gefunden.

Sagen Sie den unten Vorlage ist: (der Kürze halber vereinfacht)

<div class="k-block k-shadow"> 
     <p>Contract Start Date: </p> 
     <input type="text" tabindex="7" 
      class="k-input k-textbox" 
      name="Contract_Start_Date" 
      id="Contract_Start_Date" 
      data-bind="value:Contract_Start_Date" 
      data-format="MMMM yyyy" 
      data-start="year" 
      data-depth="year" 
      data-change="setContractMinEnd" 
      data-role="datepicker" /> 
    </div> 
    <div class="k-block k-shadow"> 
     <p>Contract End Date: </p> 
     <input type="text" tabindex="8" 
      class="k-input k-textbox" 
      name="Contract_End_Date" 
      id="Contract_End_Date" 
      data-bind="value:Contract_End_Date" 
      data-format="MMMM yyyy" 
      data-start="year" 
      data-depth="year" 
      data-role="datepicker" /> 
    </div> 

Der Code unten für das Contract_Start_Date Feld ordnet eine JS-Funktion „Ändern“ Ereignis des Feldes:

data-change: setContractMinEnd

I die obige Funktion in einem Skriptblock hinzugefügt, um mit der Seite zu gehen. Und nun das Startdatum jedes Mal das Enddatum geändert wird bekommt einen Minimalwert, der das Startdatum ist:

function setContractMinEnd() { 
    var edval = $('#Contract_Start_Date').data("kendoDatePicker"); 
    var sdval = $('#Contract_End_Date').data("kendoDatePicker"); 
    if (sdval && edval) {       
     edval.min(sdval.value()); 
    } 
} 

Sie können natürlich Lust bekommen mit dieser Logik und stellen Sie die unten oder etwas in diesem Sinne:

edval.min(new Date())

Hoffe, dass es jemand hilft ...

+0

Wenn ich min Datum zuerst festlegen muss, bevor Sie das Datum auswählen. So kann der Benutzer das vorherige Datum nicht auswählen. Wie kann ich es tun? –