Zeit und Datum

In diesem Abschnitt finden Sie ein Paar von Datumsselektoren, die zur Festlegung eines bestimmten Zeit- und Datumsbereichs dienen.

scheduler.locale.labels.section_time = 'Time period';
 
scheduler.config.lightbox.sections = [
    { name:"text", height:50, map_to:"text", type:"textarea", focus:true },
    { name:"time", height:72, type:"time", map_to:"auto"}
];

Related sample:  Basic initialization

Eigenschaften

Hier sind einige der wichtigsten Eigenschaften, die häufig mit dem 'time'-Steuerelement verwendet werden (eine vollständige Liste finden Sie hier):

Automatisches Enddatum im Time-Steuerelement

Um eine Standarddauer für ein Ereignis festzulegen und das Enddatum automatisch anzupassen, sodass diese Dauer beibehalten wird, verwenden Sie die Einstellungen event_duration und auto_end_date:

// legt die Ereignisdauer in Minuten für die automatische Anpassung der Endzeit fest
scheduler.config.event_duration = 60; 
scheduler.config.auto_end_date = true;

Related sample:  Automatic end date

Mit dieser Konfiguration wird jedes Mal, wenn die Startzeit oder das Startdatum eines Ereignisses in der Lightbox geändert wird, die Endzeit und das Enddatum automatisch aktualisiert, sodass die Ereignisdauer bei 60 Minuten bleibt (wie durch die Option event_duration festgelegt).

Reihenfolge der Datums-/Zeitselektoren

Die Reihenfolge der Datums-/Zeit-Steuerelemente innerhalb des Abschnitts 'Time period' kann angepasst oder bestimmte Selektoren entfernt werden. Dies geschieht über die Eigenschaft time_format:

scheduler.config.lightbox.sections=[
  {name:"description", height:130, map_to:"text", type:"textarea", focus:true},
  {name:"time", ..., time_format:["%H:%i","%m","%d","%Y"]}
];

Beachten Sie, dass dies nur die Reihenfolge der Elemente im Array ändert, nicht jedoch das Datenanzeigeformat. Um das Format des Zeitbereichs anzupassen, verwenden Sie das Template time_picker.

Beispiele für verschiedene Formate:

//Standard-Reihenfolge
time_format:["%H:%i", "%m", "%d", "%Y"] 
//Monat zuerst
time_format:["%m","%d", "%Y", "%H:%i"]
//Jahres-Selektor entfernt
time_format:["%H:%i", "%m", "%d"]
//falsches Beispiel
time_format:["%H:%i", "%M", "%d", "%Y"] // "%m" durch "%M" ersetzt

Mini-Kalender in der Lightbox

Ein Mini-Kalender (Date Picker) kann in die Lightbox integriert werden, um "Start"- und "Ende"-Datum auszuwählen.

Um den Mini-Kalender zur Lightbox hinzuzufügen, gehen Sie wie folgt vor:

  1. Fügen Sie die Erweiterung auf der Seite hinzu:
    scheduler.plugins({
        minical: true
    });
  2. Ändern Sie den type des time-Abschnitts von time zu calendar_time:
    //Standard Lightbox-Konfiguration
    scheduler.config.lightbox.sections=[
      {name:"description", height:200, map_to:"text", type:"textarea", focus:true},
      {name:"time", height:72, type:"time", map_to:"auto"}
    ];
    //Typ von "time" zu "calendar_time" ändern
    scheduler.config.lightbox.sections = [
      {name:"description", height:200, map_to:"text", type:"textarea", focus:true},
      {name:"time", height:72, type:"calendar_time", map_to:"auto" }
    ];

Related sample:  Mini calendar in the lightbox

Für weitere Anpassungen des Mini-Kalenders siehe Mini Calendar Templates.

Nach oben