Questions on Kendo UI for jQuery Forum

3 answers

218 views

How to disabled editable first task..

How can i disable the editable of the first task..

For example... i don't want that the users cans edit the task with Id = 1 ...

prohibited change.. Name, Dates... etc. ONLY FIRST TASK.

The code: e.preventDefault() not work... show error with "bind"

Using

if (e.task.id == 1) {

e.preventDefault()

}

show error: Error en tiempo de ejecución de JavaScript: No se puede obtener la propiedad 'bind' de referencia nula o sin definir

Gantt

answered on 09 Feb 2016

9 answers

1.0K+ views

Creating a kendo-grid with reusable options using AngularJS

How to create a kendo-grid with reusable options using AngularJS?

Besides the default settings, the grid must include a checkbox column dynamically with the option to select all rows. Methods to treat the selections should be part of the directive and, somehow, I should be able to access the rows selected in controller.

Another important behavior is to keep a reference to the grid:

// In the controller : $scope.grid

<div kendo-grid="grid" k-options="gridOptions"></div>

Below an initial path that I imagined, but it is not 100% working because AngularJS not compile information from checkbox column, so do not call the methods of the controller directive. At the same time I'm not sure where force $compile in this code.

myApp.directive('myApp', ['$compile', function ($compile) {

var directive = {

restrict: 'A',

replace: true,

template: '<div></div>',

scope: {

gridConfiguration: '='

},

controller: function ($scope) {

$scope.gridIds = [];

$scope.gridIdsSelected = [];

var updateSelected = function (action, id) {

if (action === 'add' && $scope.gridIdsSelected.indexOf(id) === -1) {

$scope.gridIdsSelected.push(id);

}

if (action === 'remove' && $scope.gridIdsSelected.indexOf(id) !== -1) {

$scope.gridIdsSelected.splice($scope.gridIdsSelected.indexOf(id), 1);

}

};

$scope.updateSelection = function ($event, id) {

var checkbox = $event.target;

var action = (checkbox.checked ? 'add' : 'remove');

updateSelected(action, id);

};

$scope.isSelected = function (id) {

return $scope.gridIdsSelected.indexOf(id) >= 0;

};

$scope.selectAll = function ($event) {

var checkbox = $event.target;

var action = (checkbox.checked ? 'add' : 'remove');

for (var i = 0; i < $scope.gridIds.length; i++) {

var id = $scope.gridIds[i];

updateSelected(action, id);

}

};

},

link: function ($scope, $element, $attrs) {

var baseColumns = [

{

headerTemplate: '<input type="checkbox" id="selectAll" ng-click="selectAll($event)" ng-checked="isSelectedAll()">',

template: '<input type="checkbox" name="selected" ng-checked="isSelected(#=Id#)" ng-click="updateSelection($event, #=Id#)">',

width: 28

}

];

for (var i = 0; i < $scope.gridConfiguration.columns.length; i++) {

var column = $scope.gridConfiguration.columns[i];

baseColumns.push(column);

}

var gridOptions = {...};

var grid = $element.kendoGrid(gridOptions).data("kendoGrid");;

$scope.$parent[$attrs[directive.name]] = grid;

}

};

return directive;

}]);

Grid

answered on 09 Feb 2016

2 answers

97 views

Boxes not aligning on side of legend

Hello, I've ran into a problem with my legend. I need the boxes to align to the left side of each of the legend. Here is my code:

legend:{
position: "bottom",
item: {
visual: function (e) {
var color = e.options.markers.background;
var labelColor = e.options.labels.color;
var rect = new kendo.geometry.Rect([0, 0], [150, 100]);
var layout = new kendo.drawing.Layout(rect, {
alignItems: "right"
});

var marker = new kendo.drawing.Path({
fill: {
color: color
},
stroke: {
color: color
},
}).moveTo(40, 0).lineTo(40, 35).lineTo(5, 35).lineTo(5, 0).close();

var label = new kendo.drawing.Text(e.series.name, [10, 0], {
fill: {
color: labelColor
},
font: "30px sans-serif",
});

layout.append(marker, label);
layout.reflow()

return layout;
}
}

Any ideas?

Charts

answered on 08 Feb 2016

1 answer

107 views

[Solved] crome devtools issue browsing kendo ui html elements

hi,

I experience a severe issue when browsing html elements (kendo ui parts) with chrome 48.0 devtools. (cf attachment)

I get the message "devtools was diconnected from the page" and devtools stop to function when, for instance, I click on the column title of a kendo grid.

You can reproduce this on kendo ui grid demo page (basic usage). Just take the "element inspector" and click on the first column title.

Seems to be a recent issue maybe due to last chrome release ?!

Any clue ?

Laurent.

General Discussions

answered on 08 Feb 2016

1 answer

137 views

Drill through capabilities

Hi,

how can I get drill through capabilities?

for example: from a pie chart, by clicking on one of it's pieces, get to a low level report with that piece parameters.

thanks!

Charts

answered on 08 Feb 2016

3 answers

318 views

Kendo UI Professional Bower package -missing files

Hi,

I have a problem with the bower package. I've seen this page http://docs.telerik.com/kendo-ui/intro/installation/bower-install

I also saw this discussion http://www.telerik.com/forums/bower and a user voice request which marked as completed: http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback/suggestions/6103564-bower-for-commercial-downloads

However, if I download Kendo UI Professional manually, there is kendo.all.min.js file in there. If I download the package using 'bower install https://bower.telerik.com/bower-kendo-ui.git' there is no such file and no files related to angular. I use angular js and kendo ui angular directives, gauge and line chart in particular. Which files out of the package do I need to use?

Thanks!

General Discussions

answered on 08 Feb 2016

1 answer

567 views

While resize the kendo grid column fix the grid width

Scrollable : {virtual:true} mandatory.

$("#grid").kendoGrid({
dataSource: data,
height: 500,

groupable: true,
sortable: false,

resizable: false,
scrollable: { virtual: true },
// scrollable: false,
resizable: true,

pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},

Data Source

answered on 08 Feb 2016

9 answers

263 views

[Solved] Grid Excel export: font warnings in Apple Numbers

When I export an Excel spreadsheet from the Kendo Grid and then open it with Apple Numbers (the spreadsheet app that ships with Mac OS X), I always get font warnings:

"The font Calibri isn't available on OS X. It was replaced with Trebuchet MS.

"The font Cambria isn't available on OS X. It was replaced with Times New Roman."

I updated my Excel-export code to set the font in each cell to "Times New Roman," and even though I can see that font in all the cells in the spreadsheet, I still get font warnings.

Is there a way to fix this so that my Numbers users don't always have to dismiss a font warning when they open the Kendo-exported XLSX files? Thanks!

Grid

answered on 08 Feb 2016

1 answer

417 views

[Solved] Getting data from a web service - error "Access-Control-Allow-Origin" header

Just trying out this framework. I am developing in Xpages (basically JSP). I have a rest service that I can call from the browser and get JSON data.

I am consuming data from this rest service in other applications.

I got a grid to work in a page using Kendo, with local data and data from the kendo service.

When I try to hook it up to my rest service I get the error ==

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://xxxx' is therefore not allowed access.

I believe this is a cross domain security feature, however, the service is from the same domain.

My code looks like this:

$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: "http://xxxxxxxxx"
},
pageSize: 20
},
height: 550,
groupable: true,
sortable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},

Grid

answered on 08 Feb 2016

3 answers

131 views

Angularjs ddl sets first value as default

Hello,

Lately I upgraded my program to use latest version of kendo. I encountered weird behaviour. If I get for example data from webapi and then call o.success then the model is setup as id of the first element. Before it wasnt like that. Did something change, is it a bug or maybe its supposed to work like that? Another thing is that If I set a static data in o.success then my model isnt set.

Example:

http://dojo.telerik.com/iDOGU

DropDownList

answered on 08 Feb 2016