````
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
},
pageSize: 15
},
height:600,
groupable: true,
sortable: true,
pageable: {
refresh: true,
pageSize: 15,
pageSizes: [15,30,50,'all'],
buttonCount: 5
},
columns: [{
template: "<div class='customer-photo'" +
"style='background-image: url(https://demos.telerik.com/kendo-ui/content/web/Customers/#:data.CustomerID#.jpg);'></div>" +
"<div class='customer-name'>#: ContactName #</div>",
field: "ContactName",
title: "联系人",
width: 210
}, {
field: "ContactTitle",
title: "职位"
}, {
field: "CompanyName",
title: "公司"
}, {
field: "Country",
title: "国家",
width: 150
}]
});
```````

TLDR: I want to draw a trend line on a stock chart.
I would like to be able to draw arbitrarily on the stock chart in an on render method, as well as in the series configuration of the chart, based on the charts data points.
I am wanting to use the kendoStockChart of type candlestick with ohlc data provided as a remote datasource, and plot a trend line by providing another series of type line. This second series is not rendered, unless I change the object to be kendoChart, in which case I lose the required stock chart features such as zoom and visualisation.
Is there any way to achieve what I am describing please?
Hi everyone,
We have special requirements to enable multiple row selection on Gantt. Idea is that we select a few tasks and propagate information further into directives and enable some sort of bulk change.
Is it possible to achieve this and how?
Thanks
Hello,
Can someone supply a current, up to date documentation for the Switch widget?
In my own research, I am finding very little info on how to use the Switch widget with MVVM. What little info I find is contradictory or incomplete, like this https://www.telerik.com/forums/kendo-mobile-switch-not-updating-viewmodel
Then I found this resource, which is definitely incomplete. It is also false, because I can't get any events to fire.
https://demos.telerik.com/kendo-ui/m/switch/mvvm.
I am in the process of converting the checkboxes of my app to switches, as per client. I am using traditional inputs, klendo dropdowns, kendo autocomplete, etc. Everything is initialized via mvvm. But for some reason, the switch widget is not working, as none of my events are binding. I must be able to listen to a change or click event, but no luck. How do i bind to the change event on a switch widget?
Also, could you include the CSS of the switch widget with the rest of the kendo widgets? If the switch widget is in the kendo javascript file by default, shouldn't the default css files also include the switch widget?

I created a separate class in .js file to create grid for me,my class is simple as following:
function createDynamicGrid(chartId, source, column, titleOfGrid,onChange) {
chartId.kendoGrid({
toolbar: titleOfGrid,
dataSource: {
data: source,
},
change: onChange,
height: 350,
scrollable: true,
sortable: true,
filterable: true,
columns: column,
noRecords: {
template: "No data"
},
});
}
in my cshtml file ,i call the above class ,pass the parameters and get the grid,but the onChange event does not trigger :
createDynamicGrid($("#grid"), dataSource, clmns, change);
function onChange(e){
//here i should get the clicked event ,but cant!
}
If I set the max property to "new Date()" the time picker does not allow me to pick a time later than now yesterday.
If "new Date()" is 27-June-2018 17:48 I can't select 26-June-2018 18:00
Is there a work-a-round? Or can I somehow have the max only affect the datepicker and not the timepicker?
$("#date-of-control").kendoDateTimePicker({
value: new Date(),
dateInput: true,
format: "dd-MMM-yyyy HH:mm",
timeFormat: "HH:mm",
weekNumber: true,
interval: 30,
max: new Date()
});

Hi support,
on a page (asp.net mvc 461) where first load is critical (and where I just need the kendo datetimepicker) I'm trying to "just include the required kendo.xxx.min.js files" (instead of just including kendo.all.min.js) (using the Audit tab in Chrome I'm told that the change reduces the load time from 11 sec to less than 3 sec).
From this page https://docs.telerik.com/kendo-ui/intro/supporting/scripts-editors I setup my bundle like this:
bundles.Add(
new ScriptBundle("~/bundles/minimalJs")
.Include("~/Scripts/jquery-3.3.1.min.js")
.Include("~/Scripts/bootstrap.min.js")
.Include("~/Scripts/kendo/kendo.core.min.js")
.Include("~/Scripts/kendo/kendo.data.min.js")
.Include("~/Scripts/kendo/kendo.binder.min.js")
// req for datetimepicker (see https://docs.telerik.com/kendo-ui/intro/supporting/scripts-editors)
.Include("~/Scripts/kendo/kendo.userevents.min.js")
.Include("~/Scripts/kendo/kendo.selectable.min.js")
.Include("~/Scripts/kendo/kendo.calendar.min.js")
.Include("~/Scripts/kendo/kendo.popup.min.js")
.Include("~/Scripts/kendo/kendo.datepicker.min.js")
.Include("~/Scripts/kendo/kendo.timepicker.min.js")
.Include("~/Scripts/kendo/kendo.datetimepicker.min.js")
.Include("~/Scripts/moment.min.js") // todo consider moving to view
.Include("~/Scripts/fingerprint2.min.js") // todo consider moving to view
.Include("~/Scripts/minimal.js")
);
In my view I do this:
<input id="datetimepicker" />
$("#datetimepicker").kendoDateTimePicker({
value: new Date()
});
The input element does not, however, render into a kendoui datetimepicker (see screenshot date-time-picker-1.png)
NB if I use the example from https://demos.telerik.com/kendo-ui/datetimepicker/index and initialize using the option dateInput: true I'm getting the following error:Uncaught TypeError: k.DateInput is not a constructor
I have also prepared an example the illustrate my issue: https://dojo.telerik.com/UXEbUMiY/3
What files must I include as a minimum to be able to use the kendo ui datetimepicker?
Thanks in advance.
Best regards
Morten

The KendoUI grid code in my application is like this:
<kendo-grid id="myGrid" options="mainGridOptions"><br> <kendoGridToolbarTemplate><br> <button kendoGridExcelCommand>Export to Excel</button><br> <kendo-grid-excel fileName="GridData.xlsx"><br> </kendo-grid-excel><br> </kendoGridToolbarTemplate><br> <div k-detail-template><br> <br> <kendo-tabstrip> Some DIVs and fields here </kendo-tabstrip><br> </div><br> <kendo-grid-excel fileName="Products.xlsx"></kendo-grid-excel><br> </kendo-grid>
The data source to this grid is attached on run-time. I am trying to make the Export to Excel button workable but it is not working. What am I doing wrong?
01.<div id="example" class="k-content">02. <div id="grid"></div>03. 04. <script>05. var test = [06. {07. "ID":1,08. "ISIN (SML)":"test"09. }10. ]11. 12. 13. $(document).ready(function() {14. $("#grid").kendoGrid({15. dataSource: {16. data: test17. }18. });19. });20. </script>21.</div>