In a scheduler timeline view having a second_scale, is it possible to click on a single date? I have found this answer, but I'm wondering if there is an event in the meantime.
There are onXScaleClick, onXScaleDblClick events for the Timeline view. But in case, when you have 2 scales, they fire only for the second one. Check console in the snippet that demonstrates it.
Nonetheless, you can add onclick event listener for the first scale using js:
var dateScaleEl = document.querySelector(".dhx_second_scale_bar");
dateScaleEl.onclick = function() {
var targetDate = scheduler.getState().date;
console.log(targetDate);
}
Demo.
getState() is a method to get the active date.
Related
1) In month view events are visible, instead of those events I want to show the counts only. How this can be achieved in DHTMLX Scheduler JS version.
2) Enable date area click event in month view, not the event_link which directs to day or week view. Just need an event when In month view a date box is clicked I have to load events of that day only on click.
It can be implemented using scheduler.addMarkedTimespan() method. You need to iterate all days during the month, count events for each day by scheduler.getEvents() and then specify the result in the html parameter of addMarkedTimespan.
function addEvCount(){
var startDate = scheduler.getState().min_date;
var endMonthDate = scheduler.getState().max_date;
while(startDate.getTime() < endMonthDate.getTime()){
var endDayDate = scheduler.date.add(startDate, 1, 'day');
var evs = scheduler.getEvents(startDate, endDayDate);
if(evs.length){
scheduler.addMarkedTimespan({
start_date: startDate,
end_date: endDayDate,
html:"<div style='text-align:center;'><b>"+evs.length+"</b></div>",
css: "color"
});
}
startDate = endDayDate;
}
scheduler.updateView();
}
Please check how it works in the snippet.
To hide all events, use also Filtering Events.
scheduler.filter_month = function(id, event){
return false; // event will not be rendered
}
The updated demo only with numbers and without rendered events.
Related docs: addMarkedTimespan(), getEvents(), Filtering.
There is onEmptyClick event which fires when the user clicks on an empty space in the scheduler (not on events). Demo.
How can I customize the Kendo scheduler's month view, so that it shows the count of events on each cell?
Is there anyway to navigate through each cell of the month view programmatically?
Any hint or direction is greatly appreciated.
All I need is to achieve the following effect:
The hardest part of this question is to navigate through all the cells in month view. The following code does the job:
var scheduler = $("#scheduler").data("kendoScheduler");
var view = scheduler.view();
var slots = view.table.find("td[role='gridcell']");
slots.each(function () {
var slot = scheduler.slotByElement(this);
//do whatever you want here with the slot variable
}
Hope it helps.
I have Kendo UI timeline view controller and I want to set events from a different datasource, which will be a JavaScript array. I tried to set array to kendoScheduler datasource but event was not bound to the controller and when I double click on timeline it gives an event popup which has unwanted fields which I can't remove. Please find the sample below.
http://dojo.telerik.com/#lilan123/UPuDE/3
I found the solution for this
var scheduler = $("#schedulerTimeLine").data("kendoScheduler");
var dataSource = new kendo.data.SchedulerDataSource({
data: WorkPlanElementList
});
scheduler.setDataSource(dataSource);
I've created a Kendo Scheduler that binds to a remote data source. The remote datasource is actually a combination of two separate data sources. This part is working okay.
Question is... is there any way to prevent certain events from being destroyed?
I've stopped other forms of editing by checking a certain field in the event's properties and calling e.preventDefault() on the edit, moveStart and resizeStart events if it should be read-only. This works fine, but I can't prevent deletes.
Any suggestions greatly appreciated.
Just capture the remove event and process it as you have with the edit, moveStart, and reviseStart events. You should see a remove event option off the kendo scheduler. I can see it and capture it in version 2013.3.1119.340.
I think better way is to prevent user from going to remove event in the first place. Handling the remove event still has its validity as you can delete event for example by pressing "Delete" key).
In example below I'm assuming event has custom property called category and events with category equal to "Holiday" can't be deleted.
remove: function(e)
{
var event = e.event;
if (event.category === "Holiday")
{
e.preventDefault();
e.stopPropagation();
}
},
dataBound: function(e)
{
var scheduler = e.sender;
$(".k-event").each(function() {
var uid = $(this).data("uid");
var event = scheduler.occurrenceByUid(uid);
if (event.category === "Holiday")
{
// use .k-event-delete,.k-resize-handle if you want to prevent also resizing
$(this).find(".k-event-delete").hide();
}
});
},
edit: function (e) {
var event = e.event;
if (event.category === "Holiday")
{
e.container.find(".k-scheduler-delete").hide();
}
}
FYI, you can do this...
#(Html.Kendo().Scheduler<ScheduledEventViewModel>()
.Name("scheduler")
.Editable(e => e.Confirmation(false))
)
which will deactivate the default confirmation prompt for the scheduler. Then you can do your own prompt on items you want.
There is also a
.Editable(e => e.Destroy(false))
that you can do to remove the X on the event window. This particular example would remove it for all of the events, but there might be a way to remove it for specific ones.
dhtmlxscheduler timeline when I use filtering
scheduler.filter_timeline = scheduler.filter_month = scheduler.filter_day = scheduler.filter_week = function(id, event) {
// display event only if its type is set to true in filters obj
if (rules[event.user_id]) {
return true;
}
// default, do not display event
return false;
};
drag animation (drawing a Node/session) doesn't work.
if you look at the DHTMLX_scheduler samples you will see create a new event doesn't work properly.
/samples/09_api/09_filtering_events.html
I am using Trace Skin . Every thing is working well. even light box is loading . the main problem is when I use this statement filter_timeline then Timeline drawing stop draw event.(It can also create it but the it is like transparent)
It is not a bug in scheduler itself, but badly written sample
In code of sample, update next line
CODE: SELECT ALL
if (filters[event.type]) {
as
CODE: SELECT ALL
if (filters[event.type] || event.type==scheduler.undefined) {
When event just created it doesn't have the type defined yet, so it was filtered out with previous logic