Samples Forum Support
Documentation
StartScheduler APIMethods

markTimespan

marks and/or blocks date(s) by applying the default or a custom style to them. Marking is cancelled right after any internal update in the app. Can be used for highlighting

array markTimespan(object config);
configobjectthe configuration object of the timespan to mark/block
arrayreturns an array of HTML elements

Example

//marks dates
scheduler.markTimespan({  
    days:  5,               // marks each Friday  
    zones: "fullday",       // marks the entire day
    css:   "gray_section"   // the applied css style
});
 
//marks and blocks dates
scheduler.markTimespan({  
    days:  5,
    zones: "fullday",
    css:   "gray_section",
    type:  "dhx_time_block" //the hardcoded value
});

Related samples

Details

The method is available from version 3.5.

The method requires the limit plugin to be activated.

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 3rd May,2012 till 'end_date' 
start_date:new Date(2012,4,3)
end_date a Date object that sets the limitation end date 
//denies creating events from 'start_date' till 3rd September,2012
end_date:new Date(2012,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(2012,6,1) //blocks 1st July,2012
zones the period in minutes that should be limited 
zones:[4*60,8*60,12*60,15*60] //2 limit blocks: 04:00-08:00,12:00-15:00
zones:"fullday" //limits the entire day
css the name of a css class 
css:"gray" //draws a DIV and applies the 'gray' css class to it
html an HTML content that will be added to the marked range 
html:"<b>Blocked</b>"//draws a DIV with this text over the marked range
type defines 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_zones specifies 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
sections allows blocking date(s) just for specific items of specific views.
BTW, the specified date(s) will be blocked just in the related view(s)		 
//blocks dates  just for the item with the id=5 in the Units view 
//and items with the id=2, id=3 in the Timeline view 
sections: { unit: 5, timeline: [2,3]}

Acceptable combinations of config properties

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 
var config ={
    days:  1, 
    zones: [9*60, 15*60], 
    css: "cssClassName", 
    sections: {
         unit: 5
    }
}
 
var config ={
    start_date: new Date(2012,7,13),
    end_date:   new Date(2012,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 the time span(s) will be hided just after any internal update occurs in the app
returns the ID of the configured time span(s) returns a DIV or an array of DIVs
See also
  • Articles
    • Back to top