Questions on Kendo UI for jQuery Forum

1 answer

144 views

HI,
In IE 10 row selection is not happening. Grid Change event is not firing. In chrome and in other browser its working fine.
Below the code what we are using.
Even we tried grid demo page in ie 10 there also selection not working.
http://demos.telerik.com/kendo-ui/grid/api

$("#gridEqpCompositions").kendoGrid({
filterable: true,
scrollable: true,
dataSource: {
//data: JSON.parse(dataResult.JsonObj),
schema: {
model: {
fields: gridFields
}
}
},
selectable: true,
change: function (e) {
Compositions.COMP_EDITABLE_ROW = this.select();
Compositions.HISTORY_EDITABLE_ROW = null;
},
columns: gridColumns
});
Change event is not at all firing when selecting a row in grid. Please help me on this ASAP

Thanks in advance

Regards,
Prasadh V

Grid

answered on 05 Jan 2015

2 answers

449 views

Kendo UI Charts with Angular JS

I am trying to create a stacked column chart with Kendo UI and I am also using Angular JS. I can get most of it working, but am having trouble with a couple of items.

1. I can't seem to get the category labels along the x axis to display. I am not clear on what syntax to use if I am using Angular JS. In my case I want to show the 'month' field from the metricsdata data source underneath each bar.

2. I can't get a plot band to display.

Below I am attaching an image of the chart I have now, along with code snippets of my controller and my index.html. Thanks for your help.

index.html

01.<kendo-mobile-view id="metrics" k-transition="'slide'" k-title="'My View'" k-layout="'default'" ng-controller="MetricsController" k-on-show="setCurrentItem(kendoEvent)">

02. <kendo-mobile-header>

03. <kendo-mobile-nav-bar>

04. <kendo-mobile-back-button k-align="'left'">Back</kendo-mobile-back-button>

05. <kendo-view-title>My View</kendo-view-title>

06. </kendo-mobile-nav-bar>

07. </kendo-mobile-header>

08.<kendo-mobile-content>

09.

10.<div style="margin-left:5px;">

11. <div kendo-chart class="chart-halfwidth chart-left-top"

12. k-title="{ text: 'My Chart' }"

13. k-legend="{ position: 'bottom' }"

14. k-series-defaults="{ type: 'column', stack: true}"

15. k-series="[

16. { field: 'myavg', name: 'Avg', color: 'green' },

17. { field: 'miss', name: 'Miss', color: 'red' }

18. ]"

19. k-value-axis="{ min:0, max:10}"

20. k-category-axis="{ labels:{ visible:true } }"

21. k-data-source="metricsdata">

22. </div>

23.</div>

24.</kendo-mobile-content>

metrics.js - MetricsController

01.myApp.controller('MetricsController', ['$scope', 'myData',

02. function($scope, myData) {

03.

04. $scope.myData = myData;

05. $scope.setCurrentItem = function(kendoEvent) {

06. var id = parseInt(kendoEvent.view.params.id);

07. myData.setCurrentItem(id);

08. };

09.

10. // Chart Data - Client Experience Metric - Transaction

11. $scope.metricsdata = new kendo.data.DataSource({

12. transport: {

13. read: {

14. url: "metrics1.json",

15. dataType: "json"

16. }

17. }

18. });

19.

20.

21.

22. }

23.]);

metrics1.json - Sample Data

01.[{

02. "month": "Feb",

03. "year": "2014",

04. "myavg": 8.10,

05. "miss": 1.90

06.},{

07. "month": "Mar",

08. "year": "2014",

09. "myavg": 8.01,

10. "miss": 1.99

11.}]

Charts

answered on 05 Jan 2015

1 answer

125 views

Header cell width cannot be change.

Dear Participants;
Before I asked at here whether I can use or not dateHeaderTemplate property in timelineMonth or another custom views
And now, I would like to ask another question about the problem occured when I set a dateHeaderTemplate.

The cell header does not change. I tried it setting many different format. Although I tried the format "dd", the header cell did not change.

Many thanks.

Scheduler

answered on 05 Jan 2015

1 answer

270 views

Editable treeview - possible?

Any updates on a clean way of making the tree node text editable?

Does Kendo have multiple inheritance when creating components? This is very easy to do in Webix:

webix.protoUI({name: 'edittree' }, webix.EditAbility, webix.ui.tree);

TreeView

answered on 05 Jan 2015

4 answers

616 views

Grid column min width with Angular

I'm trying to implement the min-width functionality for grid columns in an Angular project. Ideally, it should visually stop the resize when the minWidth limit is reached, but I would also settle for "snapping back" after the user releases the handle.

I found two possible solutions here on the forum: either modify the DOM directly (which is a decidedly "anti-Angular" solution), or update the columns via setOptions (which causes a complete redraw for the grid). The setOptions solution is a definite no, whereas DOM modification seems hacky at best.

What would be a recommended way to achieve this? Is such an option scheduled for near-future releases?

Thank you.

Grid

answered on 05 Jan 2015

1 answer

145 views

A bar to show calculated remaning date

Dear Guys;
We need a bar to show calculated remaning date.
I want to show the difference with different colors. If the number is negative, I want to show it as red. If the number is possitive, I want to show it as green.
How can I do? To me, I think I can solve this problem using Progressbar widget. However, I do not know how I can use the progress for this purpose.

ProgressBar

answered on 05 Jan 2015

1 answer

216 views

Kendo Grid hideColumn bug in IE11

To reproduce the bug do the following:

1. Create Kendo Grid with say 6 columns using MVC wrappers
2. Add Scrollable() option
3. Bind to DataBound Event
4. Use function for event

function hideGridColumns() {

for (var i = 0; i < 5; i++) {

$("#grid").data('kendoGrid').hideColumn(i);

}

IE11 gives error Unable to get property 'style' of undefined or null reference

Grid

answered on 05 Jan 2015

3 answers

125 views

[Solved] Use only dragging option

Hello
I just wonder if following functionality is possible with kendo dragging:
My requirement is following:
a) I have container
b) I'm loading image inside, sometimes is bigger sometimes is smaller
c) If image is bigger I want to be able to move image to see invisible part, something like hidden scrolling but with dragging.

Kendo dragging has moving functionality already, so I would like if possible use it.

So my question is that possible?

Regards
Marcin

Drag and Drop

answered on 04 Jan 2015

10 answers

463 views

Column resizing and detail templates: not working

Hi,

I'm trying to create (in v2014.3.1119) a grid with a detail template (which contains a grid), but now I can't resize the columns of the main grid. Is this a limitation or a bug?

Steps to reproduce:
Edit the example from http://demos.telerik.com/kendo-ui/grid/detailtemplate to include have a "resizable: true" in the grid config and the columns are not resizable. Remove the "detailTemplate" and "detailInit" and the columns areresizable.

Grid

answered on 02 Jan 2015

2 answers

536 views

[Solved] Slide out animation for window?

Hi there,

We have a non-modal window with product details we want to slide in and out over a page. The slide-in animation is working fine, but I can't get the slide-out to work. The fade does work so I know it is performing some animation. The slide-out is considered a "must-have" feature. Is there any way to do this?

Thanks!

Here is the window definition:

$("#detail-window").kendoWindow({

animation: {

open: {

effects: "slideIn:left fadeIn",

duration: 500

},

close: {

effects: "slide:right fadeOut",

duration: 500

}

},

draggable: false,