addMarkedTimespan to block schedule changing

Scheduler Javascript
#1

Hello,

I have a schedule in Month view. I would like to block scheduling changes for appointments that appear on the schedule but that are more than 2 months old. I have tried to use addMarkedTimespan and nothing appears on the schedule (it looks the same). I don’t know if I am doing something wrong or perhaps you can’t block dates in Month view? I want the user to be able to see the schedule but not make changes (so change background to gray would be fine).

Thanks in advance!

Here is a snippet of my code:

[code]…
var config ={
start_date: new Date(2011,2,16),
end_date: new Date(2013,2,16),
css: “gray_section”,
days: “fullweek”,
type:“dhx_time_block”

}

		scheduler.init('scheduler_here', new Date(), "month");
		scheduler.setLoadMode("month");
		scheduler.load("data/XML-PHP-1.php");
		scheduler.addMarkedTimespan(config);
		scheduler.updateView();

…[/code]

#2

Hello again,

Maybe my post was confusing. My questions are:

–can you block days for scheduling when they are in the past and already contain events? I would like the events to be there but not allow the user to make changes to them if they are in the past.
–can you do this in Month view?
–do you declare it before the scheduler is loaded?
–from my code can you see any reason why no days are being grayed out? (ie the calendar looks as if you can schedule on any day, when I want some days grayed out)

Many thanks again!

#3

Hi,
by default marked timespans does not shows up in the month view.
You can enable them with following css rule: .dhx_scheduler_month .dhx_marked_timespan{ display: block; }

#4

Hello,

I have added that to my javascript code (or do I need to add it to the scheduler.css?)

Anyway, the result is I do not have any dates grayed out…I don’t know what I am doing wrong…they are also not grayed out in week and timeline view.

Any ideas?

Many thanks,

#5

Hi,

Adding this code gives me a red dotted vertical line in today’s date in month view.

I am unable to get a date range to be grayed in in month view…

???

#6

Hi,

This is my latest code:

[code]var config ={
start_date: new Date(2013,4,13),
end_date: new Date(2013,4,14),
zones: “fullday”,
css: “gray_section”,
type:“dhx_time_block”

}

		scheduler.init('scheduler_here', new Date(), "month");
		scheduler.setLoadMode("month");
	
		scheduler.load("data/XML-PHP-1.php");
		scheduler.addMarkedTimespan(config);
		scheduler.updateView();[/code]

Nothing happens except I see a red dotted line. I have added the css class:

[code].gray_section{
background-color:#CCC;

}[/code]

Would really like to know what I am doing wrong so I can fix this!!

Thanks!!

#7

Hello,

OK, the dates are grayed out…

But, I would like to see the previously scheduled events behind the gray (they are not visible). Is it possible to see the loaded events even when block the dates for updates to the schedule?

Many thanks,

#8

Hello,
sorry for the delay.

Is it possible to see the loaded events even when block the dates for updates to the schedule?

you can either set opacity of marked timespans, or z-index of month events. Please see the attachment
01_basic_init.zip (1 KB)

#9

Thank you! Works great!

#10

Hello!

The above solution is working great for Month view. However, if I click to Week or Day view, I don’t see the events (only the grayed out CSS). Is there something a need to add to be able to see the events in front of the grayed out CSS for the dates that have been set with addMarkedTimeSpan?

Many thanks!

Cheers,

#11

Hello,

I had posted that I wasn’t able to view the previously scheduled events in Month view in a timespan defined by addMarkedTimeSpan. This now works. However, similarly I cannot see the previously scheduled events in Week/Day view (I believe they are hidden behind the CSS for the blocked days).

I believe I am missing some CSS but not sure what to add to make this work…

Thanks again!

Cheers,

#12

Hi,
looks like i’ve specified z-index only to event of month view. If you add it to .dhx_cal_event as well, events will show up.
Here is the updated css .dhx_cal_event_clear, .dhx_cal_event_line, .dhx_cal_event{ z-index: 1; }example is attached
01_basic_init_fix.zip (1.01 KB)

#13

Hello,
check the latest answer

#14

Hi,

I keep getting error on:-
Microsoft JScript runtime error: Object doesn’t support property or method ‘_currentDate’

at dhtmlxscheduler_limit.js
var c = scheduler._currentDate(),

<script src="<%= Url.Content("~/Scripts/dhtmlxscheduler.js")%>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/ext/dhtmlxscheduler_units.js")%>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/ext/dhtmlxscheduler_week_agenda.js")%>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/dhtmlxscheduler_limit.js")%>" type="text/javascript"></script>
    <link href="<%= Url.Content("~/Scripts/dhtmlxscheduler.css")%>" rel="stylesheet" type="text/css" />
    <script src="<%= Url.Content("~/Scripts/json2.js")%>" type="text/javascript"></script>

:
:
var config ={
			start_date: new Date(2013,7,13),
			end_date:   new Date(2013,7,14),
			zones: "fullday",
			css: "gray_section",
			type:"dhx_time_block"

		};
        scheduler.addMarkedTimespan(config);

OR

                scheduler.attachEvent("onTemplatesReady", function() {
                // Setting up holidays
                var holidays = [new Date(2013, 01, 01), new Date(2013, 7, 7), new Date(2013, 7, 30)];
                for (var i = 0; i < holidays.length; i++) {
                    var date = holidays[i];
                    var options = {
                        start_date: date,
                        end_date: scheduler.date.add(date, 1, "day"),
                        type: "dhx_time_block", /* creating events on those dates will be disabled - dates are blocked */
                        css: "holiday",
                        html: "Holiday"
                    };
                    scheduler.addMarkedTimespan(options);
                }
              });

Please advise.

Thank you.

Regards,
Micheale

#15

Hi, Micheale
looks like you have old version of dhtmlxscheduler.js
Please try the latest version
dhtmlx.com/x/download/regular/dh … eduler.zip

#16

Hi,

im able to mark timespans quite well. Only question i have is that when in month view, only part of the cell is marked, div.dhx_month_body is colored as i want to, but div.dhx_month_head remains with its default color. Is this normal behavior? Thanks