I have a scheduler which allows to add attendees

 

A pop up window comes from a template

 

My problem is that the multiselect sets new attendees but not reading them when I want to edit it

 

InvitesUsers come from my model and it is a SelectList and I set it like this:

InvitedUsers = users.ToSelectList(x => new ExtSelectItem
                        {
                            Selected = true,
                            Text = x.Name,
                            Value = x.Id.ToString()
                        }

I was wondering if there is a way to group certain rows by column name and not repeating that column name in the process.  In my Gantt chart, each row represents an individual project with the project name as the title.  But I also have columns to the left of those titles for an Initiative and then a Track.  I want to group projects with the same initiative by not repeating the initiative name on each line and instead having it stated once in a larger box spanning all of the project titles with that initiative name.  I'd also like to do the same thing for tracks to group identical initiative names.  For clarity I attached a screenshot with my layout. 

I am trying to get my actionlinks to redner into one column.  Currently I have them all laid out in individual columns, but can't figure out how to merge them into one.

 

I'm using the same dataSource for a kendo grid as I am for a layer on my map.  In some situations I don't want to show anything from that layer on the map, but I still need to display them on the grid so I can't just clear the dataSource.  Is there a way to hide a map layer?

I'm using a panelbar to display a list of chapters. Within each panel is a list of tasks within that chapter. Think of it like a list:

• Chapter 1
•     Task 1
•     Task 2
• Chapter 2
•     Task 3
•     Task 4
• Chapter 3
•     Task 5

When the page is loaded, I want to expand the panel w/ the first incomplete task. I know which chapter contains this task (by index, not by ID), and want to have it be expanded when I initialize the panelbar.

Current accordion JS:

And some sample HTML:

So if my first incomplete task is Task 4, I would know that it's the second (or first, if you use 0-based indexing) panel I want to have expanded when the panelbar is created. While I do have multiple selection enabled, for the initial load, only the one panel (with the incomplete task) should be expanded.

Hi

I have the following ClientTemplate column:

Values displayed or entered here are not exported to PDF.

How can I make this work?

Thanks

 

 

Hi

  I want to replace every tooltip on my site with the kendo one, I also want in some places to use the 'title' of the div, or to get data dynamically using ajax. To accomplish this I have a tooltip like the below

 

$('body').kendoTooltip({
   filter: "img[data-tooltip-data], div[data-tooltip-data], [title][title!='']",

 

and content gets the content depending on the target type. I've put the tooltip on body as I want it across everything on the site. I've used a single tooltip rather than multiple tooltips, this is based on advice I've seen in the forums. 

I'm getting the problem you can see in the dojo below.

 

http://dojo.telerik.com/AmEYa

 

 The tooltip never disappears. I'm assume I'm doing something wrong here but I'm not sure how I'm meant to do this

 

thanks

Anthony

Hi,

Is there any way to retrieve a view column index from the model ( myGrid.columns ) ?

I'm looking for a method like viewIndex() on a column object such like the following code ( or viewIndex(column) ) :

Have you any idea ?

 Thanks for your help.

 

 

 

I'd like to switch a column of a grid to display a more human readable relative time string (similar to moment.js's fromNow() method) but I'd also like the column to still be sortable based the actual date object. How can I accomplish this?

Hi,

 

A newbee to kendo and js:). I am trying to use kendo scheduler in my project and having issue with Create / update operations. Create / Update opertions works and DB is updated but kendo UI dialog stays and gets following error "Uncaught TypeError: Cannot read property 'getTimezoneOffset' of null". Refreshing browser display newly added /updated  event. Also in destroy method I nned to add event id to path like /schedules/id, how to add this, in parameterMap we gets like options.models[0].id but not in destroy method.

Any quick help is appreciated. Posting my code:

'use strict';

/*
* Add UI Functions To This File Such As "ManipulateDataFromServer"
* */

adoc.controller('accountManagerController', [
'$scope', '$rootScope', '$filter', 'adoc.common', 'restServices', 'TokenStorage',
function ($scope, $rootScope, $filter, ADOCServices, restServices, TokenStorage) {

$scope.colors = [
{name: 'black', shade: 'dark'},
{name: 'white', shade: 'light'},
{name: 'red', shade: 'dark'},
{name: 'blue', shade: 'dark'},
{name: 'yellow', shade: 'light'}
];

$scope.myColor = $scope.colors[2];

$scope.changeColor = function (newColor) {
$scope.myColor = newColor;
};

$scope.myData = [];

$scope.loadPractices = function () {
restServices.call('GET', "/adoc/practice/all").then(
function (response) {
$scope.gridPractice.data = response.data;
console.log($scope.gridPractice.data);
});
};

$scope.gridPractice = {
autoResize: true,
rowHeight: 70,
//data:$scope.loadPractices(),
enableRowSelection: true,
columnDefs: [
{
field: 'id',
displayName: 'Practice Id',
cellTemplate: '<div class="controls-column"><div ng-controller="accountManagerController">{{row.entity.id}}</div>' +
'<div class="grid-row-links-container">' +
'<button class="btn-link" ng-click="grid.appScope.editSelectedPractice(row.entity.id);">Edit</button>' +
'<button class="btn-link" href="#">View Website</button>' +
'<button class="btn-link" href="#">Delete</button>' +
'</div>' +
'</div>'
},
{
field: 'name',
displayName: 'Practice Name'
},
{
field: 'path',
displayName: 'Path'
},
{
field: 'email',
displayName: 'Email'
}
]
}

$scope.myData2 = [
{
"practiceId": "1",
"firstName": "Cox",
"lastName": "Carney",
"company": "Enormo",
"employed": true
},
{
"practiceId": "2",
"firstName": "Lorraine",
"lastName": "Wise",
"company": "Comveyer",
"employed": false
},
{
"practiceId": "3",
"firstName": "Nancy",
"lastName": "Waters",
"company": "Fuelton",
"employed": false
},
{
"practiceId": "4",
"firstName": "Cox",
"lastName": "Carney",
"company": "Enormo",
"employed": true
},
{
"practiceId": "5",
"firstName": "Lorraine",
"lastName": "Wise",
"company": "Comveyer",
"employed": false
},
{
"practiceId": "6",
"firstName": "Nancy",
"lastName": "Waters",
"company": "Fuelton",
"employed": false
}
];

$scope.gridPracticeAdmins = {
autoResize: true,
rowHeight: 70,
data: $scope.myData2,
enableRowSelection: true,
columnDefs: [
{
field: 'firstName',
displayName: 'First Name',
cellTemplate: '<div class="controls-column"><div ng-controller="accountManagerController">{{row.entity.firstName}}</div>' +
'<div class="grid-row-links-container">' +
'<button class="btn-link" ng-click="grid.appScope.editSelectedPractice(row.entity.practiceId);">Edit</button>' +
'<button class="btn-link" href="#">Delete</button>' +
'</div>' +
'</div>'
},
{
field: 'lastName',
displayName: 'Last Name'
},
{
field: 'company',
displayName: 'UserName'
}
]
};

// Filter Practices
$scope.filterPractice = function () {
console.log($scope.searchPractices);
$scope.gridPractice.data = $filter('filter')($scope.myData, this.searchPractices, undefined);
};

// Show Edit Page For Editing The Selected Practice
$scope.editSelectedPractice = function (practiceId) {
alert(practiceId);
};

$scope.init = function () {
$scope.loadPractices();
};

$scope.schedulerOptions = {
date: new Date("2015/6/13"),
startTime: new Date("2015/6/13 07:00 AM"),
minorTickCount: 1,
height: 850,
editable: true,
isAllDay: false,
views: [
{type: "day", selected: false},
{type: "week", selected: false},
{type: "month", selected: true},
{type: "workWeek", selected: false},
{type: "agenda", selected: false},
{type: "timeline", eventHeight: 50}
],
timezone: "Etc/UTC",
dataSource: {
batch: true,
/* sync: function() {
this.read();
},*/
transport: {
read: {
// url: "http://demos.telerik.com/kendo-ui/service/tasks",
url: "/schedules/practice/" +
$rootScope.user.practiceId,
headers: {'X-AUTH-TOKEN': TokenStorage.retrieve()},
dataType: "json"
},
update: {
// url: "http://demos.telerik.com/kendo-ui/service/tasks/update",
url: "/schedules/",
headers: {'X-AUTH-TOKEN': TokenStorage.retrieve()},
method: "post",
contentType: "application/json; charset=utf-8",
dataType: "json"
},
create: {
url: "/schedules/",
headers: {'X-AUTH-TOKEN': TokenStorage.retrieve()},
method: "put",
contentType: "application/json; charset=utf-8",
dataType: "json"


},
destroy: {
// url: "http://demos.telerik.com/kendo-ui/service/tasks/destroy",
url: "/schedules/",
headers: {'X-AUTH-TOKEN': TokenStorage.retrieve ()},
method: "delete",
contentType: "application/json; charset=utf-8",
dataType: "json"
},
parameterMap: function (options, operation) {
switch (operation) {
case "read":

break;
case "update":
if (options.models) {
console.log(kendo.stringify(options.models[0].id));
console.log(kendo.stringify(options.models[0].scheduleTitle));
console.log(kendo.stringify(options.models[0].scheduleStartTime));
console.log(kendo.stringify(options.models[0].scheduleEndTime));
console.log(kendo.stringify(options.models[0].scheduleDescription));
console.log(kendo.stringify(options.models[0].recurrenceId));
console.log(kendo.stringify(options.models[0].recurrenceRule));
console.log(kendo.stringify(options.models[0].recurrenceException));
console.log(kendo.stringify(options.models[0].physicianId));
console.log(kendo.stringify(options.models[0].practiceId));
console.log(kendo.stringify(options.models[0].allDay));

/* return {models: kendo.stringify(options.models)};*/
return kendo.stringify({
id: options.models[0].id,
scheduleTitle: options.models[0].scheduleTitle,
scheduleStartTime: options.models[0].scheduleStartTime,
scheduleEndTime: options.models[0].scheduleEndTime,
scheduleDescription: options.models[0].scheduleDescription,
recurrenceId: options.models[0].recurrenceId,
recurrenceRule: options.models[0].recurrenceRule,
recurrenceException: options.models[0].recurrenceException,
physicianId: options.models[0].physicianId,
practiceId: $rootScope.user.practiceId,
allDay: options.models[0].allDay
})
}
break;
case "create":
if (options.models) {
console.log(kendo.stringify(options.models[0].scheduleTitle));
console.log(kendo.stringify(options.models[0].scheduleStartTime));
console.log(kendo.stringify(options.models[0].scheduleEndTime));
console.log(kendo.stringify(options.models[0].scheduleDescription));
console.log(kendo.stringify(options.models[0].recurrenceId));
console.log(kendo.stringify(options.models[0].recurrenceRule));
console.log(kendo.stringify(options.models[0].recurrenceException));
console.log(kendo.stringify(options.models[0].physicianId));
console.log(kendo.stringify(options.models[0].practiceId));
console.log(kendo.stringify(options.models[0].allDay));

/* return {models: kendo.stringify(options.models)};*/
return kendo.stringify({
scheduleTitle: options.models[0].scheduleTitle,
scheduleStartTime: options.models[0].scheduleStartTime,
scheduleEndTime: options.models[0].scheduleEndTime,
scheduleDescription: options.models[0].scheduleDescription,
recurrenceId: options.models[0].recurrenceId,
recurrenceRule: options.models[0].recurrenceRule,
recurrenceException: options.models[0].recurrenceException,
physicianId: options.models[0].physicianId,
practiceId: $rootScope.user.practiceId,
allDay: options.models[0].allDay
})
}
break;
case "destroy":
console.log(options.models[0].id);
return kendo.stringify({id: options.models[0].id});
break;
}

}
},
schema: {
model: {
id: "id",
fields: {
id: {from: "id", type: "number"},
title: {from: "scheduleTitle", defaultValue: "No title", validation: {required: true}},
start: {type: "date", from: "scheduleStartTime"},
end: {type: "date", from: "scheduleEndTime"},
description: {from: "scheduleDescription"},
recurrenceId: {from: "recurrenceId", defaultValue: 0},
recurrenceRule: {from: "recurrenceRule"},
recurrenceException: {from: "recurrenceException"},
ownerId: {from: "physicianId", defaultValue: 1},
practiceId: {from: "practiceId"},
isAllDay: {type: "boolean", from: "allDay"}
}
}
},

filter: {
logic: "or",
filters: [
{field: "ownerId", operator: "eq", value: 1},
{field: "ownerId", operator: "eq", value: 2}
]
}
},
resources: [
{
field: "ownerId",
title: "Owner",
dataSource: [
{text: "Alex", value: 1, color: "#f8a398"},
{text: "Bob", value: 2, color: "#51a0ed"},
{text: "Charlie", value: 3, color: "#56ca85"}
]
}
]
};

$scope.selectedTags = [];

$scope.loadTags = function (query) {
// Get Available Providers From DB As An Array
var availableTags = [
{text: 'All', value: -1},
{text: 'Provider 1', value: 1},
{text: 'Provider 2', value: 2},
{text: 'Provider 3', value: 3},
{text: 'Provider 4', value: 4},
{text: 'Provider 5', value: 5},
{text: 'Provider 6', value: 6}
];


// Get All Providers Selected
var allProvidersSelected = 0;
for (var i = 0; i < $scope.selectedTags.length; i++) {
allProvidersSelected = $scope.selectedTags[i].value;
if (allProvidersSelected == -1) {
break;
}
}
console.log(allProvidersSelected);

// Get Selected Providers IDs
var selectedIds = [];
if (allProvidersSelected == -1) {
for (var i = 0; i < availableTags.length; i++) {
selectedIds.push(parseInt(availableTags[i].value));
}
} else {
for (var i = 0; i < $scope.selectedTags.length; i++) {
selectedIds.push(parseInt($scope.selectedTags[i].value));
}
}

// Filter Providers Schedule On Addition Of Tags
var scheduler = $(".k-scheduler").data("kendoScheduler");
scheduler.dataSource.filter({
operator: function (task) {
return $.inArray(task.ownerId, selectedIds) >= 0;
}
});


// Return Filtered Set Of Available Providers
return $filter('filter')(availableTags, query, undefined);
};

}
]);