Zum Hauptinhalt springen

addMarkedTimespan

Description​

Markiert Datumsangaben, aber bei bestimmten Einstellungen führt dies zu einer Blockierung (das Festlegen eines benutzerdefinierten Stils für das Limit ist möglich)

addMarkedTimespan: (config: any) => number

Parameters​

  • config - (erforderlich) Objekt - das Konfigurationsobjekt des zu markierenden bzw. blockierenden Zeitraums

Returns​

  • id - (number) - die ID des hinzugefügten Zeitraums

Example​

// marks dates
scheduler.addMarkedTimespan({
    days: 5, // marks each Friday
    zones: "fullday", // marks the entire day
    css: "gray_section" // the name of applied CSS class
});
scheduler.updateView();

// marks and blocks dates
scheduler.addMarkedTimespan({
    days: 5,
    zones: "fullday",
    css: "gray_section",
    type: "dhx_time_block" // the hardcoded value
});
scheduler.updateView();

Details​

The method is available from version 3.5.

Hinweis

Die Methode erfordert das aktivierte [limit]-Plugin.

Hinweis

Hinweis: Das Markieren (Blocking) wird nicht direkt nach dem Aufruf der Methode angewendet. Sie sollten updateView() aufrufen, um die Markierung anzuwenden.

Configuration object properties​

The configuration object can contain the following properties:

Property

Description

start_date a Date object that sets the limitation start date
// denies creating events from 2027-05-03 till 'end_date'
start_date: new Date(2027, 4, 3)
end_date a Date object that sets the limitation end date
// denies creating events from 'start_date'
 // till 2027-09-03
end_date: new Date(2027, 8, 3)
days days that should be limited
days: [0, 2, 6] // limits Sunday, Tuesday and Saturday
days: "fullweek" // limits the entire week
days: new Date(2027, 6, 1) // blocks 2027-07-01
zonesthe period in minutes that should be limited
// 2 limit blocks: 04:00-08:00, 12:00-15:00
zones: [4 * 60, 8 * 60, 12 * 60, 15 * 60]
zones: "fullday" // limits the entire day
cssthe name of a css class 
css: "gray" // draws a DIV and applies the 'gray' css class to it
htmlan HTML content that will be added to the marked range 
// draws a DIV with this text over the marked range
html: "<b>Blocked</b>"
typedefines the time span's type. The 'dhx_time_block' type 'says' to apply blocking to the timespan. With any other type (you can specify any value) set, events will be just marked 
type: "dhx_time_block" // events will be marked and blocked
invert_zonesspecifies, whether time zones (set by the 'zones' property) must be inverted (default - false) 
// results in 2 limitation blocks: 00:00-08:00, 17:00-24:00
zones: [8 * 60, 17 * 60], invert_zones: true
// results in 2 limitation blocks: 00:00-08:00, 17:00-24:00
zones: [0, 8 * 60, 17 * 60, 24 * 60], invert_zones: false
sectionsallows blocking date(s) just for specific items of specific views. The specified date(s) will be blocked only in the related view(s)
// blocks dates just for the item with the id=5 in the Unit view
// and items with the id=2, id=3 in the Timeline view
sections: { unit: 5, timeline: [2, 3] }

Acceptable combinations of config properties​

Hinweis

Note, days, zones and start_date, end_date properties are used in pairs to set the blocking interval and can't be mixed and used in some other variation. For example, you can't specify zones, start_date or days, start_date, end_date at the same time.

Therefore, there are 2 acceptable combinations with specific set of properties:

Set of properties

Example

  • days
  • zones
  • invert_zones
  • css
  • html
  • type
  • sections
const config = {
    days: 1,
    zones: [9 * 60, 15 * 60],
    css: "cssClassName",
    sections: {
        unit: 5
    }
};
  • start_date
  • end_date
  • css
  • html
  • type
  • sections
const config = {
    start_date: new Date(2027, 7, 13),
    end_date: new Date(2027, 7, 14),
    css: "cssClassName",
    sections: {
        unit: 5
    }
};

markTimespan() and addMarkedTimespan() comparison​

addMarkedTimespan

markTimespan

requires calling the updateView() method to draw a DIV for the time span

draws a DIV for the time span automatically

the time span(s) exists all time along

der Zeitraum existiert dauerhaft

returns the ID of the configured time span(s)

returns a DIV or an array of DIVs

Need help?
Got a question about the documentation? Reach out to our technical support team for help and guidance. For custom component solutions, visit the Services page.
Need more help?Contact Support