Questions on Kendo UI for jQuery Forum

3 answers

302 views

For some reason, any tab content that is getting generated with the result of an ng-repeat shows up with no style (tab strip and body). Below is my sample code. I have attached a screen shot of it rendering that shows the Hello and World tabs being styled and the other items being ignored. I have this tab wrapped in a bootstrap Modal.

Prereqs:
AngularJS v1.3.2
Bootstrap v3.1.1
jQuery 2.1.3
kendoui v2014.3.1223
Browsing with, Google Chrome: v39.0.2171.99

<div kendo-tab-strip k-content-urls="[ null, null]" style="background-color: white; border-color: white">

<ul style="background-color: white">

<li class="k-state-active">Hello</li>

<li>World</li>

<li ng-repeat="tab in selectedItem.Ui">Tab# {{$index}}</li>

</ul>

<div style="padding: 1em">

Chicken

</div>

<div style="padding: 1em">

Thigh

</div>

<div ng-repeat="tab in selectedItem.Ui" style="padding: 1em">

{{$index}}

</div>

I do have this working in a different location. It is also inside of a Bootstrap modal. However, it is also sitting inside a few different containers. Here is the container path:
Bootstrap Modal --> static kendoui-tab-strip --> Bootstrap collapse accordion --> kendoui-tab-strip powered with ng-repeat

TabStrip

answered on 30 Nov 2015

1 answer

381 views

k-animation-container

The menu widget is nesting a menu container in a div.k-animation-container. The k-animation-container is adding a 2px x 2px white box on the menu when it is open. I've tried to defeat by removing the dimensions in both css and javascript. Any advice on how to remove this? Thanks...Matt

Menu

answered on 29 Nov 2015

1 answer

60 views

Kendo UI does not work with the newest AngularJS

Hi,

if I use the newest or any of newer Versions of AngularJS, the Kendo UI components will not shown correctly. It looks like the directives does not work.

I use Kendo UI and AngularJS in a Cordova application.

With best regards

Johann

General Discussions

answered on 27 Nov 2015

3 answers

7.3K+ views

Grid page change event

Hi,

There doest not seem to be an event associated with page change. Is there any way I can figure out if a page change has occurred with information such as current page etc ?

Regards,
Danish

Grid

answered on 27 Nov 2015

2 answers

186 views

Themed Combo Box

I am currently using the MetroBlack theme. I have a pop-up window that is all black, and it has a combo box inside of it. But the box is all white which does not look correct to me.

<select id="liveServer" class="comboStyle">

<option>ws://localhost:61623/stomp</option>

<option>ws://vwdhad:61623/stomp</option>

</select>

If I set the background color to pure black, to match the rest, then I loose the (v) down-arrow icon (it is also black) so I have resorted to this CSS, which makes is a dark grey backgrond and white text. But something tells me that the theme should be doing this automatically. What am I missing?

.comboStyle {

font-family: Arial, sans-serif;

font-size: 16px;

padding: 4px 7px;

color: #ffffff;

background-color: #404040;

}

ComboBox

answered on 27 Nov 2015

2 answers

821 views

[Solved] grid header icon for sortable column weird behavior

I have the following grid. When I used just a title on the first column sorting worked fine. However, the title text did not line up with the following column heading which was aligne vertically in the 'middle' of the header cell.

In the current configuration, the title is at the bottom. Clicking once moves the title to the top of the cell and puts the sort arrow graphic underneath and at the very left of the cell. Clicking again changes the direction of the sort and arrow. Clicking a third time puts the title at bottom, without the sort arrow and restores the rows to their initial order.

Can I move the graphic to the end of the title, like it was before, but all in the middle of the header cell?

Thanks,

Rick

var meetingLogGrid = $("#meetingLogGrid").kendoGrid({

dataSource: logEntryDS,

height: "100%",

width: "100%",

autoBind: false,

groupable: false,

sortable: true,

pageable: {

refresh: true,

pageSize: 5,

pageSizes: true,

buttonCount: 5

},

columns: [{

field: "Created",

// title: "Date/Time",

format: "{0: yyyy-MM-dd HH:mm}",

headerTemplate: "<div style='vertical-align:middle;'>Date/Time</div>",

width: 135

}, {

field: "LogEntry",

title: "Description",

headerTemplate: kendo.template($("#logGridTemplate").html()),

template: "<div style='max-height:25px;overflow:hidden;'>#: LogEntry #</div>",

// width: 360,

sortable: false

}, {

command: [ { name: "more", click: function (e) { console.error("log grid e: ", e);

e.preventDefault();

var tr = $(e.target).closest('tr');

var rowData = this.dataItem(tr); console.error("rowData: ", rowData);

$("#LogEntryDateTime").val(rowData.Created.toString());

$("#LogEntryText").val(rowData.LogEntry);

$("#LogEntryPopup").data("kendoWindow").open();

}}],

width:80

}],

editable: false // { mode: 'popup' },

}).data("kendoGrid");

Grid

answered on 27 Nov 2015

4 answers

729 views

[Solved] How to desactivate kendo on focus

Hello!

Since I updated my kendo ui to the last version I had a problem with all the components, for example look at this:

The first image you can see "focus desactivated", the old project, when i click on the grid nothing happens, but now in this version when Iclick it appears a focus.

There is an option to disable it?

Thanks

General Discussions

answered on 27 Nov 2015

1 answer

182 views

Chart update/redraw

Hi,

When the datasource changes the bar chart will also update to reflect. However the effect seems to be a re-draw, or creation of the chart again. ie the animation causes the bars to load vertically upwards from zero each time. What I would like to achieve is for the chart to adjust to the new data, from it's current bar values. Anyone done this or similar? There is another thread see here, http://www.telerik.com/forums/best-way-to-draw-chart-with-dynamically-changing-data but this reloads the chart from 0, rather than just changing the value from the current position, see fiddle.. http://jsbin.com/vifoziwiza/1/edit this is not the desired effect I'm after.

I want something more similar to the radial gauge (http://demos.telerik.com/kendo-ui/radial-gauge/index ) where the value changes and the needle just moves to the new position. Same effect on the bar chart, where the data changes and the bars just move to the new position.

Charts

answered on 27 Nov 2015

1 answer

171 views

[Solved] Multiple markers on one point for Area Chart

Hi, is it posible to show a marker with tooltip for each area in an area chart, since they are separate series i can't figure out how to trigger them at the same time. I sent an example image in case it's not clear.

Charts

answered on 27 Nov 2015

1 answer

101 views

[Solved] Show an event as background.

Hello,

I'm using Kendo UI v2015.1.429, I need to show an event as background and full width column another events show as normally in schedule view. Please see details in attached image.

Is there any way to do that?

thanks advance,

Scheduler

answered on 27 Nov 2015