Hello,
I want to create a link inside my Kendo template, but I always get the Error 'Invalid Template ...'
Is there anyone who can help me with this?
<a href="/#/Kontakt/Info/#:KONTAKTID#" target="_blank">
Tank you in advance
Hi there,
I'm trying to run Kendo Editor on React using the sample that appears on NPM.
I'm using webpack.
This is my component:
var KendoEditor = require('kendo-ui-react-jquery-editor').default; //Don't forget CSS, webpack used to include CSS require('../../../Content/Telerik/kendo.common.min.css');require('../../../Content/Telerik/kendo.default.min.css');require('../../../Scripts/Telerik/kendo.editor.js'); var Example = React.createClass({ render: function() { return ( <KendoEditor options={{height: 550,sortable: true}}> </KendoEditor> );}});module.exports = Example;This is my view
@Html.React("Client.Example", new { }, clientOnly: true)
And I'm already bundling kendo.editor.js and kendo.all.js.
The error that appears is:
Uncaught TypeError: Cannot read property 'Editor' of undefined
On this line:
//note I am not using jQuery plugin to instantiate, don't want to wait for namespace on $.fn this.widgetInstance=new _kendoEditor2['default'].ui.Editor(elementNode,this.props.options);//if props are avaliable for events, triggers, unbind events, or methods make it happen now
Can you please help? Thanks in advance.
Here's what I'm working with: http://dojo.telerik.com/uYidA/2
If you sort the columns and then try to inline edit something and save it, it will invoke the destroy function call for the column that you have sorted.
Thanks in advance!
If primitive binding is disabled (e.g. not using k-data-value-field), I cannot set the value of the drop down programmatically. For example: http://dojo.telerik.com/aZUXi
I'm using KendoUI Grid within SharePoint 2013 webpage.
I am able to update my item using the CSOM within the function. After the function completes i get the error :
Here is the code in the kendo.all.js: (error line in italics/bold)
_promise: function (data, models, type) {
var that = this;
return $.Deferred(function (deferred) {
that.trigger(REQUESTSTART, { type: type });
that.transport[type].call(that.transport, extend({
success: function (response) {
deferred.resolve({
response: response,
models: models,
type: type
});
},
error: function (response, status, error) {
deferred.reject(response);
that.error(response, status, error);
}
}, data));
}).promise();
},
Here is my grid :
$("#kendoMyAssignedTable").kendoGrid({
dataSource: {
type: "ajax",
transport: {
read: function(operation){
$.ajax({
url: _spPageContextInfo.webAbsoluteUrl + $select=ID,Assigned,CONVERSION_x0020_ACTIVITY,Stat/Title,id,txt_AssignedTo,Comments,ActivityDueDate,ConvSchedID/LOCATION_x0020_NAME,Responsible/Title,WeekGroupID/Title,WaveID/Title,ConvSchedID/ID&$expand=Stat,ConvSchedID,WaveID,ConvSchedID,Responsible,WeekGroupID&$filter=(Responsible/Title eq '" + m + "') and (Assigned eq 1) and (Stat/Title ne 'Completed') and (Stat/Title ne 'Not Started')&$orderby=ActivityDueDate,WeekGroupID/ID",
type: "GET",
headers: {
"accept": "application/json;odata=verbose",
},
cache: false
})
.done(function(result){
operation.success(result.d.results);
})
.fail(function (result){
var test = '';
})
},
},
pageSize: 20,
group: [
{field: "WaveID.Title"},
{field: "Stat.Title"},
{field: "ConvSchedID.LOCATION_x0020_NAME"}
],
sort: {field: "ActivityDueDate", dir: "asc"}
},
batch: true,
navigatable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
filterable: true,
groupable: true,
dataBound: function(o){
var g = $("#kendoMyAssignedTable").data("kendoGrid");
console.log(g.columns.length);
for (var i=0; i < g.columns.length; i++){
g.showColumn(i);
}
$("div.k-group-indicator").each(function(i,v){
g.hideColumn($(v).data("field"));
})
},
allowCopy: true,
toolbar: ["save","cancel", "excel"],
columnMenu: true,
resizeable: true,
saveChanges: function(e){
var grid = $("#kendoAssignedTable").data("kendoGrid");
var data = grid.dataSource.data();
var dirty = $.grep(data,function(item){
return item.dirty
});
var myItem = '';
var ctx =SP.ClientContext.get_current();
var items=SP.ListOperation.Selection.getSelectedItems(ctx);
var list=ctx.get_web().get_lists().getByTitle("ConvCheckList");
console.log("dirty",dirty);
$(dirty).each(function(i,v){
console.log(v.Stat.Title);
myItem = v.ID;
var objectitem = list.getItemById(myItem);
objectitem.set_item("Stat", v.Stat.ID);
objectitem.update();
ctx.executeQueryAsync();
});
},
columns: [
{
field: "WaveID.Title",
title: "Wave",
filterale: {multi: true, search: true},
editor: function(element, options){element.text(options.model.WaveID.Title)}
},
{
field: "ActivityDueDate",
title: "Due Date",
type: "date",
filterable: {multi: true, search: true},
format: "{0:d}",
width: 150,
editor: function(element, options){element.text(options.model.ActivityDueDate)}
},
{
field: "WeekGroupID.Title",
title: "Week",
filterable: { multi: true, search: true},
width: 400,
editor: function(element, options){element.text(options.model.WeekGroupID.Title)}
},
{
field: "CONVERSION_x0020_ACTIVITY",
title: "Conversion Activity",
editor: function(element, options){element.text(options.model.CONVERSION_x0020_ACTIVITY)}
},
{
field: "ConvSchedID.LOCATION_x0020_NAME",
title: "Location Name",
filterable: { multi: true, search: true},
editor: function(element, options){element.text(options.model.ConvSchedID.LOCATION_x0020_NAME)}
},
{
field: "Stat.Title",
title: "Status",
filterable: { multi: true, search: true},
editor: myStatusDropDown,
template: "#=Stat.Title#"
},
{
field: "Comments",
title: "Comments"
}
],
editable: true
});
}
function myStatusDropDown(container, options){
$('<input required name="' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataTextField: "Title",
dataValueField: "Title",
dataSource: {
transport: {
read: function(operation){
$.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('CheckListStatus')/Items?$select=Title,ID",
type: "GET",
headers: {
"accept": "application/json;odata=verbose",
},
cache: false
})
.done(function(result){
operation.success(result.d.results);
var datas = $(result.d.results);
console.log(datas);
})
.fail(function(result){
var test = '';
})
}
}
}
});
}

http://dojo.telerik.com/iwepo/5
In the grid I have a filterable date column with IsNull and IsNotNull operators. Above the grid I have a button which clears all the dataSource filters.
This works fine if you set the date column to be filtered on a value, e.g. is before / today's date.
However, if you choose the IsNull or IsNotNull operator, and then click the Clear filters button, the dataSource is indeed unfiltered, but the grid filter controls are NOT updated (the clear button remains visible, and the dropdown still has that operator selected).
This appears to affect IsNull, IsNotNull, IsEmpty, and IsNotEmpty, across all data types (number, date, text).
Is there some reason the filter controls are only updated when removing some (but not all) operators?

We have implemented a bunch of Angular 1 Kendo controls into our application. We have been encountering some slowness on the front end with the browser freezing when transitioning view states. I did some investigating, and was able to identify the issue as being related to the destroy methods kendo has implemented.
I put in some performance testing code around the destroys, and for EACH calendar control on the page, the .destroy() method is taking ~100ms, and for kendo windows, it is taking ~120-160ms per instance. If I comment the destroy method calls out, the page runs smoothly (but obviously we open ourselves up to memory leaks, so probably not a viable option).
We have plenty of our own directives on the page, and destroying all our controls collectively takes under 5ms. Why is each instance of these kendo controls taking 20+ more time than the rest of our controls combined? Is this a known issue?
We aren't doing anything overly fancy with our implementation, below is how our date picker is implemented.
<input kendo-date-picker
k-options="::datepickeroptions"
ng-model="value"
ng-show="!readmode"/>
We are using ~6 month old version of the library, however updating it to the latest made no improvement.
Any help would be appreciated!
Thanks.
Hi friends,
I am trying to work with ajax on Kendo UI grid but the DataSourceRequest.sort property is always null to me.
Here is my grid:-
@(Html.Kendo().Grid<MvcApplication1.Utility.
Employee>()
.Name("Grid")
.EnableCustomBinding(true) .
Columns(columns => {
columns.Bound(p => p.EmpId).Groupable(false);
columns.Bound(p => p.EmpName);
columns.Bound(p => p.EmpDepartment);
columns.Bound(p => p.EmpSal);
})
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax().Events((events => events.Error("onError")))
.Read(read => read.Action("Employee_Read", "Home"))
.ServerOperation(true) ) )
My Code behind:-
public JsonResult Employee_Read([DataSourceRequest]DataSourceRequest request)
{
var employees = GetEmployeeData();
DataSourceResult result = employees.ToDataSourceResult(request);
return Json(result, JsonRequestBehavior.AllowGet);
}
Please note that Employee class is not IQueryAble.
Please suggest suitable solution.
Regards,
Ankit Verma
