Hi,
All the examples that show off the endless scroll are with serverPaging setted to true. When I try to set it to a local data source, the listview has many UI issues.
I modified an example to demonstrate the issues I am facing. Just by modifying the data-endless-scroll from true to false and the listview loads correctly. No where in the documentation does it mention anything about it having to be a server side paging, it only requries the pageSize attribute on the data source.
http://dojo.telerik.com/eFiMu/4
Thanks
Hi,
I'm taking a lot of caution to display date in right format, but dispite of this it doesn't still work.
In grid columns definition :
1.columns : [2....3. { field: "date", title: "At", type: "date", format: "{0: dd/MM/yyyy}"}4....5.]My datasource :
01.... 02.dataSource: new kendo.data.DataSource({03. data: [{id:1,date:moment().format("DD/MM/YYYY")}],04. schema: {05. model: {06. id: "id",07. fields: {08. ...09. date: {type: "date", format: "dd/MM/yyyy"},10. ...11. }12. }13. },14. sort: {field: "date", dir: "asc"}15. })
Setting general kendo culture.
1.kendo.culture("fr-FR");
And my grid :
<div kendo-grid="kgrid" k-data-source="...dataSource" k-options="myoptions"></div>
Thanks in advance for your tips !

Hi,
I am trying to alert users when they switch to a different month, if there are dates selected but not saved in the scheduler. The user can click cancel to stay in the current view without losing the date selection, or click confirm to go to a different month. Is it a way to handle it?
Thank you.
Hi,
I am in the process of evaluating the chart component for my company. We need to use Angularjs combined with Typescript in ASP.NET (C# MVC) to create our charts. After downloading the trial version, we looked at the angular.html page in the examples for line-charts. Just using this example works great.
We are then trying to separate the controller from the html to a typescript file. The following is what we have done:
index.html (part about the chart) :
<link href="~/Content/shared/styles/examples-offline.css" rel="stylesheet">
<link href="~/Content/styles/kendo.common.min.css" rel="stylesheet">
<link href="~/Content/styles/kendo.rtl.min.css" rel="stylesheet">
<link href="~/Content/styles/kendo.default.min.css" rel="stylesheet">
<link href="~/Content/styles/kendo.dataviz.min.css" rel="stylesheet">
<link href="~/Content/styles/kendo.dataviz.default.min.css" rel="stylesheet">
<script src="~/Scripts/kendo/jquery.min.js"></script>
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-route.js"></script>
<script src="~/Scripts/kendo/kendo.all.min.js"></script>
<script src="~/Scripts/kendo/console.js"></script>
<script src="~/App/ChartViewer/chartviewer-contracts.js"></script>
<script src="~/App/ChartViewer/chartviewer-datasvc.js"></script>
<script src="~/App/ChartViewer/chartviewer-ctrl.js"></script>
<script src="~/App/ChartViewer/chartviewer-app.js"></script>
<div ng-app="ChartViewerApp">
<div class="appContainer">
<div ng-controller="ChartViewerCtrl as ctrl" ng-init="ctrl.init('@Model.siteId')">
<div>TESTOUTPUT of DATA: {{electricity}}</div>
<div class="demo-section k-content wide">
<div>
<h4>Hover some series</h4>
<div id="mychart" kendo-chart
k-legend="{ position: 'bottom' }"
k-series-defaults="{ type: 'line' }"
k-series="[
{ field: 'nuclear', name: 'Nuclear electricity' },
{ field: 'hydro', name: 'Hydro electricity' },
{ field: 'wind', name: 'Wind electricity' }
]"
k-data-source="electricity"
k-series-hover=""
style="height: 250px;">
</div>
</div>
</div>
</div>
</div>
</div>
We then have our typescript files.
chartviewer-app.ts
/// <reference path="../../scripts/typings/jquery/jquery.d.ts" />
/// <reference path="../../scripts/typings/kendo/kendo.all.d.ts" />
var chartviewerAppLoaded = true;
module Test.ChartViewer {
// Defines the modules to be used
var app = angular.module("ChartViewerApp", ['ngRoute','kendo.directives']);
app.factory('ChartViewerDataSvc', ['$http', '$q', TestChartViewer.DataService.ChartViewerDataSvc.SubscriptionDataSvcFactory]);
app.controller('ChartViewerCtrl', ['$rootScope', '$scope', 'ChartViewerDataSvc', ​Test.ChartViewer.Controller.ChartViewerCtrl]);
}​
chartviewer-contracts: (not important)
chartviewer-ctrl:
/// <reference path="../../scripts/typings/jquery/jquery.d.ts" />
/// <reference path="../../scripts/typings/angularjs/angular.d.ts" />
/// <reference path="../../scripts/typings/angularjs/angular-route.d.ts" />
/// <reference path="../../scripts/typings/kendo/kendo.all.d.ts" />
module ​Test.ChartViewer.Controller {
export interface IChartViewerScope extends ng.IScope {
chartview: ​Test.Models.ChartViewer;
electricity: any;
}
export class ChartViewerCtrl {
private $scope: IChartViewerScope;
private $rootScope: ng.IRootScopeService;
private _dataSvc: ​Test.ChartViewer.DataService.ChartViewerDataSvc;
constructor($rootScope: ng.IRootScopeService, $scope: IChartViewerScope, clientviewerDataSvc: ​Test.ChartViewer.DataService.ChartViewerDataSvc) {
this.$rootScope = $rootScope;
this.$scope = $scope;
this._dataSvc = clientviewerDataSvc;
this.$scope.electricity = this.electricity();
//this.electricity();
}
public init(siteId: string): void {
this._siteID = siteId;
this.initLoad();
}
private initLoad(): void {
var self: ChartViewerCtrl = this;
self._dataSvc.getData(this._siteID).then(function (data) {
self.$scope.chartview = data;
});
}
public electricity(): kendo.data.DataSource {
return new kendo.data.DataSource({
data: [
{
"country": "Spain",
"year": "2008",
"unit": "GWh",
"solar": 2578,
"hydro": 26112,
"wind": 32203,
"nuclear": 58973
},
{
"country": "Spain",
"year": "2007",
"unit": "GWh",
"solar": 508,
"hydro": 30522,
"wind": 27568,
"nuclear": 55103
}
],
sort: {
field: "year",
dir: "asc"
}
});
}
public onSeriesHover(): void {
//dont do anything
console.log('test');
}
}
} ​
​chartviewer-datsvc.ts: (not important)
So, if I run the example as is with the above code, the chart is never drawn (which I would have expected)
If I then change the electricity function in the chartviewer-ctrl to
public electricity(): void {
var chartData = $("#mychart").kendoChart();
}
then it can draw a chart, but with no datasource. So far so good. If I then add
var myDataSource = new kendo.data.DataSource({
data: [
{
"country": "Spain",
"year": "2008",
"unit": "GWh",
"solar": 2578,
"hydro": 26112,
"wind": 32203,
"nuclear": 58973
},
{
"country": "Spain",
"year": "2007",
"unit": "GWh",
"solar": 508,
"hydro": 30522,
"wind": 27568,
"nuclear": 55103
}
],
sort: {
field: "year",
dir: "asc"
}
});
$("#mychart").kendoChart({
dataSource: myDataSource
});
myDataSource.read();
then still no chart. I have used many hours and many different methods of trying to set the datasource from my ctrler (above is just one of the attempts), but with no luck. Is there an example that you can provide for this? Meaning using typescript and having the typescript files defined separately.
Hello
I'm trying to use the scheduler with a custom event editor that has already been written. I want to open that when the edit event is triggered, but if call preventDefault on it, the event disappears from the scheduler. How can I prevent this from happening?
Hi folks,
I am working on the following scenario. On my page I have two components: kendo line chart and kendo grid. From the grid I am able to select rows and drag them to the chart. The problem I experience is that I can't transform the chart into kendoDropTarget. I have tried the following code, when the chart is rendered. Just bear in mind that I am using controller as syntax. What I am getting as a result is "TypeError: vm.trendChart.kendoDropTarget is not a function"
vm.addDropToChartSeries = function () { vm.trendChart.kendoDropTarget({ dragenter: alert('drag area entered'), drop: alert('element dragged!') }); } One of the requirements for a project I'm working on is to have a static row at the top of a kendo grid. This row will show data that is to be compared with other rows in the grid. What would be the easiest way to go about having this row get into the grid and have it remain at the top of the grid regardless of the sort? Client side sorting is turned on as of now.
Thanks in advance!

I'm using KendoUI with Microsoft Edge and I have some problems with ASP MVC Wrapper and NumericTextBox when I use French culture :
My server culture is set to "fr-FR", so all Html.TextBoxFor and Html.Kendo().CurrencyTextBox() render numeric values with "," instead of "."
http://dojo.telerik.com/AfUCU/4
<input type="number" value="42,02" id="test" name="test" />
<script>
kendo.culture("fr-FR");
$("#test").kendoNumericTextBox({"format":"c"});
</script>
Original razor code :
@Html.Kendo().CurrencyTextBox().Name("test").Value((decimal?)42.02d)
With Chrome, IE11, Firefox => Display = 42,02
With Microsoft Edge => Display nothing : Input is Blank