Here is my initialization of my kendo scheduler:
scheduler = $('#scheduler').kendoScheduler({
toolbar: [ 'pdf' ],
pdf: {
fileName: 'Current Schedule View.pdf',
proxyTarget: '_blank'
},
date: new Date(),
startTime: new Date(),
timezone: "America/Chicago",
editable: {
template: $("#editor_template").html(),
},
messages: {
pdf: 'To PDF'
},
eventTemplate: $('#event_template').html(),
views: [
"day",
{type: "week", selected: true},
"workWeek",
"month",
{type: "agenda", eventTemplate: $('#agendaEventTemplate').html()},
{type: "timeline", eventHeight: 50}
],
dataSource: dataSource,
save: function(e){
console.log('Saving');
console.log(e);
},
cancel: function(e){
console.log('Cancelling');
console.log(e);
console.log(e.event.ownerId[0].value);
console.log(attendeeSaver);
e.event.ownerId = e.event.ownerId[0].value;
e.event.attendees = attendeeSaver;
console.log(e);
},
edit: function(e){
console.log(e);
attendeeSaver = e.event.attendees;
//if(e.event.ownerId == '{!currentUser}' || e.event.ownerId == 'none'){
console.log(e);
console.log(e.event.attendees);
console.log(e.event.ownerId);
console.log($('#WhoIdSearchInput'));
var whatIdAutoComp = $('#WhatIdInput').kendoAutoComplete({
minLength: 3,
filter: 'contains',
dataTextField: 'name',
noDataTemplate: $('#noDataTemplate').html(),
filtering: whatId_filter,
dataBound: whatId_dataBound,
change: whatId_change,
open: whatId_open,
select: whatId_selection
}).data('kendoAutoComplete');
console.log($('#WhatIdInput'));
var whoIdAutoComp = $('#WhoIdInput').kendoAutoComplete({
minLength: 3,
filter: 'contains',
dataTextField: 'name',
noDataTemplate: $('#noDataTemplate').html(),
filtering: whoId_filter,
dataBound: whatId_dataBound,
open: whoId_open,
change: whoId_change,
select: whoId_selection
}).data('kendoAutoComplete');
console.log('Test spot');
Visualforce.remoting.Manager.invokeAction('{!$RemoteAction.CalendarData.getOrgUsers}', function(result, event){
result = result.replace(/\"\;/g, '"');
var resultArray = JSON.parse(result);
var userList = [];
for(var i = 0; i < resultArray.length; i++){
var gradientColor = ColorLuminance(resultArray[i].color, -0.5);
var personalColor = 'linear-gradient(' + resultArray[i].color + ', ' + gradientColor + ')';
var person = { name: resultArray[i].name, value: resultArray[i].ownerId, tagColor: personalColor, color: resultArray[i].color };
userList.push(person);
}
console.log('test spot');
$('#OwnerIdInput').kendoMultiSelect({
maxSelectedItems: 1,
placeholder: 'Select Event Owner',
tagTemplate: '<span class="selected-value"</span><span style="color: white;">#:data.name#</span>',
template: $('#dropDownTemplate').html(),
dataTextField: 'name',
dataValueField: 'value',
dataSource: {
data: userList
},
change: function(e) {
//console.log(e);
console.log('Inside owner box');
var selectedTags = $('.k-multiselect li.k-button');
for(var i = 0; i < selectedTags.length; i++){
var tag = $(selectedTags[i]);
var item = $(tag.find('span.selected-value'));
for(var k = 0; k < userList.length; k++){
if(item[0].textContent === userList[k].name){
tag.css({'background': userList[k].tagColor, 'width': '100px', 'height': '30px', 'font-size': '15px', 'overflow':'hidden', 'text-overflow':'ellipsis', 'border-radius':'5px'});
}
}
}
},
});
console.log('done making owner box');
console.log($('#OwnerIdInput').data('kendoMultiSelect'));
$('#OwnerIdInput').data('kendoMultiSelect').trigger('change');
console.log('triggered owner box');
//Populate edit/create popup fields with passed parameters
/*for(var i = 0; i < parsedParamData.length; i++){
console.log($('#'+parsedParamData[i].fieldName+'Input')[0]);
if(parsedParamData[i].fieldName == 'WhatId' || parsedParamData[i].fieldName == 'WhoId'){
$('#'parsedParamData[i].fieldName+'Input')[0].prop('value', ''+parsedParamData[i].recordName);
//$('#'+parsedParamData[i].fieldName+'Input').data('kendoAutoComplete').value(parsedParamData[i].recordName);
}
else if(parsedParamData[i].fieldName == 'OwnerId'){
$('#'+parsedParamData[i].fieldName+'Input').prop('value', ''+parsedParamData[i].recordId);
//$('#'+parsedParamData[i].fieldName+'Input').data('kendoMultiSelect').value(parsedParamData[i].recordId);
}
}*/
});
Visualforce.remoting.Manager.invokeAction('{!$RemoteAction.CalendarData.getAllOrgResources}', function(result, event){
result = result.replace(/\"\;/g, '"');
var resultArray = JSON.parse(result);
console.log(resultArray);
var userList = [];
for(var i = 0; i < resultArray.length; i++){
var gradientColor = ColorLuminance(resultArray[i].color, -0.5);
var personalColor = 'linear-gradient(' + resultArray[i].color + ', ' + gradientColor + ')';
var person = { name: resultArray[i].name, value: resultArray[i].ownerId, tagColor: personalColor, color: resultArray[i].color, resourceType: resultArray[i].ownerType, email: resultArray[i].email };
userList.push(person);
}
$('#inviteInput').kendoMultiSelect({
enable: false,
maxSelectedItems: 90,
placeholder: 'Select People/Resources/Groups to Invite',
tagTemplate: '<span class="selected-value"</span><span style="color: white;">#:data.name#</span>',
template: $('#dropDownTemplate').html(),
dataTextField: 'name',
dataValueField: 'value',
dataSource: {
data: userList,
group: {field: 'resourceType'}
},
change: function(e) {
//console.log(e);
var selectedTags = $('.k-multiselect li.k-button');
for(var i = 0; i < selectedTags.length; i++){
var tag = $(selectedTags[i]);
var item = $(tag.find('span.selected-value'));
for(var k = 0; k < userList.length; k++){
if(item[0].textContent === userList[k].name){
tag.css({'background': userList[k].tagColor, 'width': '100px', 'height': '30px', 'font-size': '15px', 'overflow':'hidden', 'text-overflow':'ellipsis', 'border-radius':'5px'});
}
}
}
}
});
$('#inviteInput').data('kendoMultiSelect').trigger('change');
});
/*Can alter initial time interval here*/
var startTime = $('#startTimeInput').data('kendoDateTimePicker');
$('#endTimeInput').data('kendoDateTimePicker').value(new Date(startTime.value().getTime() + 30*60000));
$('#groupCheck').change(function(){
var invites = $('#inviteInput').data('kendoMultiSelect');
if(this.checked){
invites.enable(true);
} else{
invites.enable(false);
}
});
},
resources: resources
}).data('kendoScheduler');
My problem is the line: $('#OwnerIdInput').data('kendoMultiSelect').trigger('change');
When I click an already existing event to pop open the edit/create popup menu, If I click 'save', all is fine. I can continuously open and close the edit menu as long as I click 'save.' If, however, I click 'cancel' after opening the edit menu once, if I click it again, I will get the following error
Uncaught TypeError: i.wrap is not a function at kendo.all.js:4554
And it happens at the OwnerIdInput change trigger mentioned above. Triggering change has not issues outside of pressing the 'cancel' button and I am just not sure what is causing this behavior or how to fix it.