Hi..
Im using kendo mutliselect and dropdown list using angular js. i want to display items not available if items are not there.
i tried with select event its working only if drop down is not in repeat and with id,how can i do if drop down or multi select is with in ng-repeat. and if i use select event i need to do more code,is there any alternative to solve this issue?
here is my code for multi select:
<select kendo-multi-select k-ng-model="manageResource.asset.operators"
k-data-text-field="'name'"
k-data-value-field="'operatorId'"
k-data-source="manageResource.authorisedOperator"
k-options="manageResource.customOptions" k-rebind="manageResource.customOptions"></select>
manageResource.customOptions = {
placeholder: "Select Operator",
valuePrimitive: true,
autoBind: false,
headerTemplate: '<div class="dropdown-header k-widget k-header">' +
'<span>Photo</span> ' +
'<span>Employee Name</span>' +
'</div>',
itemTemplate: '<span class="k-state-default">' +
'<img src="#:data.imagePath#" alt="edit" width="24px" height= "24px" /></span>' +
'</span> ' +
'<span class="k-state-default">#: data.name #</span>',
tagTemplate: '<span class="selected-value">' +
'<img src="#:data.imagePath#" alt="edit" width="24px" height= "24px" /></span>' +
'</span>' +
'<span>#:data.name#</span>'
}
Thank.

Hi..
Im using kendo gantt chart. im giving option to view gantt chart data in full screen mode.im customizing the edit option for each task.when chart is in full screen mode if i trie to edit task details popup is opening behind the full screen,how to open popup infront of full screen
here is my code for gantt chart full screen
View:
<div id="activityganttchart" kendo-gantt k-options="createScheduleStep2.ganttOptions" class="row"
k-rebind="createScheduleStep2.ganttOptions"></div>
<button class="grid-action-btn fullscreenBtn rightalign tooltipstyle action-gird-btn" uib-tooltip="Full screen" data-toggle="tooltip" tooltip-placement="top" ng-click="createScheduleStep2.toggleFullScreen()"><i class="settinggrid fa fa-arrows-alt"></i></button>
controller:
function toggleFullScreen(control: string) {
if (!document.fullscreenElement &&
!document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) {
if (document.getElementById(control).requestFullscreen) {
document.getElementById(control).requestFullscreen();
} else if (document.getElementById(control).msRequestFullscreen) {
document.getElementById(control).msRequestFullscreen();
} else if (document.getElementById(control).mozRequestFullScreen) {
document.getElementById(control).mozRequestFullScreen();
} else if (document.getElementById(control).webkitRequestFullscreen) {
var element: any = Element;
document.getElementById(control).webkitRequestFullscreen(element.ALLOW_KEYBOARD_INPUT);
}
return true;
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
return false;
}
}
function onToggleFullScreen() {
var editor = $("#activitygantt");
if (toggleFullScreen("activitygantt")) {
editor.children()[1].style.setProperty("height", $(document).height() + "px");
editor.children()[1].style.setProperty("width", $("body").width() + "px");
} else {
editor.removeClass('fullscreenMode');
editor.children()[1].style.setProperty("height", "400px");
editor.children()[1].style.setProperty("width", "1573px");
}
};
function exitHandler() {
var editor = $("#activitygantt");
if (document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement) {
editor.addClass('fullscreenMode');
} else {
editor.removeClass('fullscreenMode');
editor.children()[1].style.setProperty("height", "400px");
editor.children()[1].style.setProperty("width", "1573px");
var ganntchart = $('#activityganttchart').data('kendoGantt');
ganntchart.wrapper.css("height", "400px");
ganntchart.resize();
}
}
if (document.addEventListener) {
document.addEventListener('webkitfullscreenchange', exitHandler, false);
document.addEventListener('mozfullscreenchange', exitHandler, false);
document.addEventListener('fullscreenchange', exitHandler, false);
document.addEventListener('MSFullscreenChange', exitHandler, false);
}
Appreciate your support!
Thanks!

I've approached support about this, but since I can't upload a solution verbatim to a Dojo, I can't really reproduce it (that I know of).
In the attached screenshot, you can see that the DropDownList and other controls that are either Kendo controls or style by Kendo theme look normal, but the datePicker and NumericTextBox have a thick blue padding at the bottom. And the datePicker's icon is displaced to the right.
Any ideas are welcome. I can't post the example per se, as the apps are huge and involve a SQL database etc that I can't upload. However, this issue has been present for as long as I've been using Kendo controls, formerly in ASP.Net forms and now in html/WEBApi applications.
Thanks, Bob Graham
Hiya,
I was just wondering how to re-template the series labels. I used the following snippet for both the label and the tooltip but it's only working for the tooltip.
labels: { visible: true, template: kendo.template($("#template").html())}, tooltip: { visible: true, template: kendo.template($("#template").html())}If setting the template for labels this way is not possible, is there a way then to make the tooltip visible all the time and not only on hover?
Kindly advise.
Best regards,
Byang

We are using Kendo Editor and trying to localize the fields.
Most of the controls are working fine but the 'Format' DropDown control title tip is not getting localized.
I am providing localized text for "message.formatting" key while initializing the kendo editor.
I dig into the kendo.all.min.js file and found that while initializing the Formatting control, title tip is hard code to 'Format'. And if I change it to some other value, totol
Hi,
how to perform insert and delete operation after binding to a dataSource. I tried to solve in different ways but all ends in some issue.
Create a dojo snippet to reproduce issue.
Issues :-
1. After applying formula to a column data sheet.range("F2:F").formula("C2*D2"); try to add a row
Getting error - kendo.all.js:98306 Uncaught Error: Shifting nonblank cells off the worksheet is not supported!
2. Change formula to sheet.range("F2:F14").formula("C2*D2"); leaving one final row. Can insert one record.
Is there any way to apply formula to all cells in column without affecting the add functionality.
3. " dataSource.cancelChanges()" will copies the below row to current row.
Hi,
I'm using the kendo dataSource (kendo.data.TreeListDataSource) for a treeList widget in an angularJS project.
Everytime I'm trying to update one of the items via inline editing I get the following error (in chrome). The error occurs when "other" clients are called via SignalR to update their data. Code on the server:
public ContactTreeListDto UpdateListItem(ContactTreeListDto item){Clients.Others.UpdateListItem(item);return item;}
VM2835:3 Uncaught SyntaxError: Unexpected numberextend.setter @ kendo.all.js:2018Observable.extend._set @ kendo.all.js:4541ObservableObject.extend.accept @ kendo.all.js:4734Model.define.accept @ kendo.all.js:89185DataSource.extend._createNewModel @ kendo.all.js:89252Observable.extend.pushUpdate @ kendo.all.js:6187Observable.extend._push @ kendo.all.js:6038Observable.extend._pushUpdate @ kendo.all.js:6028proxy @ jquery-2.2.1.js:492hubProxy.fn.hubProxy.on.callbackMap.(anonymous function).(anonymous function) @ jquery.signalR-2.2.0.js:2611jQuery.event.dispatch @ jquery-2.2.1.js:4732elemData.handle @ jquery-2.2.1.js:4544jQuery.extend.trigger @ jquery-2.2.1.js:7791jQuery.fn.extend.triggerHandler @ jquery-2.2.1.js:7881(anonymous function) @ jquery.signalR-2.2.0.js:2817(anonymous function) @ jquery.signalR-2.2.0.js:791jQuery.event.dispatch @ jquery-2.2.1.js:4732elemData.handle @ jquery-2.2.1.js:4544jQuery.extend.trigger @ jquery-2.2.1.js:7791jQuery.fn.extend.triggerHandler @ jquery-2.2.1.js:7881signalR.transports._logic.triggerReceived @ jquery.signalR-2.2.0.js:1490(anonymous function) @ jquery.signalR-2.2.0.js:1511jQuery.extend.each @ jquery-2.2.1.js:360signalR.transports._logic.processMessages @ jquery.signalR-2.2.0.js:1510(anonymous function) @ jquery.signalR-2.2.0.js:1933Kendo version is Kendo UI v2016.1.226
Here's the treeList configuration from controller:
(function() { 'use strict'; angular .module('XPhoneWeb') .controller('contactTreeListController', ['$scope', 'signalrService', 'notificationService', contactTreeListController]); function contactTreeListController($scope, signalrService, notificationService) { var vm = this; vm.reloadContactsCallback = function () { // auf Befehl des Servers alle Kontakte neu laden :-) notificationService.info("Kontaktliste wegen Änderung neu laden", "Nachricht vom Server"); $scope.contactTreeList.dataSource.read(); } vm.reload = function () { $scope.contactTreeList.dataSource.read(); } vm.add = function (id) { alert('groupId: ' + id); var row = $("#contactTreeList").data("kendoTreeList") .tbody .find("tr[data-uid='" + id + "']"); //$scope.contactTreeList.addRow($("#contactTreeList tbody>tr[data-uid='" + groupId + "']")); $scope.contactTreeList.addRow($(row)); } initTreeList(); registerEvents(); function registerEvents() { // Event-Callback registrieren signalrService.on('contactTreeListHub', 'reloadContacts', vm.reloadContactsCallback); // Im Destroy-Event des Controllers die SignalR-Event Callback Methode wieder deregistrieren $scope.$on('$destroy', function () { signalrService.off('contactTreeListHub', 'reloadContacts', vm.reloadContactsCallback); }); } // initialisiert die TreeList function initTreeList() { var hub = signalrService.getHubProxy('contactTreeListHub'); var startPromise = signalrService.getStartPromise(); vm.treelistOptions = { // DataSource Konfiguration dataSource: new kendo.data.TreeListDataSource ({ type: 'signalr', autoSync: true, // muss für POPUP Edit false sein, sonst werden 2 Update events gefeuert... transport: { signalr: { promise: startPromise, hub: hub, server: { read: 'readContactTreeList', update: 'updateListItem', destroy: 'deleteListItem', create: 'addListItem' }, client: { read: 'readContactTreeList', update: 'updateListItem', destroy: 'deleteListItem', create: 'addListItem' } } }, schema: { errors: "serverErrors", model: { id: "id", parentId: "parentId", fields: { parentId: { type: "string", visible: false, nullable: true }, groupName: { type: "string", editable: true, nullable: true }, displayName: { type: "string", editable: true } // TODO: Presence aufdröseln } } }, error: function(e) { notificationService.error(e.errors, "Nachricht vom Server"); }, push: function(e) { alert('e.type: ' + e.type); alert('e.items: ' + JSON.stringify(e.items)); } }), // TreeList Konfiguration sortable: false, editable: true, columns: [ { field: 'displayName', title: 'Name', template: $('#contactTreeListItemTemplate').html(), }, { field: '', title: '', template: $('#contactTreeListItemAddTemplate').html(), }, { command: [ { name: 'edit' }, { name: 'destroy' } ] } ] }; } }})()