Hello
We're experiencing slow performance in IE 11 with a Kendo Grid when it contains a couple hundred rows. We use a custom rowTemplate which is fairly complex, with icons and angular markup.
What I see when debugging is that on every change to one item of the grid (change is triggered externally, not via direct edit on the grid, and sent to the DataSource with pushUpdate()), the whole grid is being re-rendered, which is fairly expensive as it has to render the complex template for all hundreds of rows.
Is it possible to have the grid only re-render the affected row ? It should significantly increase performance in our case.
Thanks

I have an Angular App that muss send an authorization header within every request that makes to the server.
When defining the kendo datasource, I've added the header field:
this._tableData = new kendo.data.DataSource({
transport: {
read: {
cache: true,
url: `${this.baseUrl}/uiobjects/_search`,
dataType: "json",
contentType: "application/json; charset=utf-8",
type: "POST",
headers: {'Authorization': this.header}
},
Allowing me to fill the kendo grid with data, but for one of the rows I've defined a template:
template: `<div class='title'><div class='pic'><img src="#:_links.previewdata.href#" alt="thumbnail"></div><span>#: title #</span></div>`
and there makes another request to the server in order to grab the image.
My problem here, is that I am not being able to set this authorization header for these request. Angular interceptors doesn't work because they are not made through $http.
Is there any clean way to intercep these request, or to add a Header??
Hello,
I'm trying to create a kendo grid with pagination, sorting and filtering in server side.
The grid configuration in client side is:
$scope.options = { sortable: true, filterable: true, pageable: true, dataSource: { transport: { read: { url: "api/items", contentType: "application/json", dataType: "json", type: "POST" }, parameterMap: function (options) { return kendo.stringify(options); } }, schema: { total: "totalItems", data: "items" }, serverPaging: true, pageSize: 4, serverSorting: true } };In server side, I've tried to do the pagination but it doesn't work. I have used Kendo.DynamicLinq. The DataSourceRequest containg (take, skip, sort) is corrected loaded from the request but when the query is executed it returns an error because of AutoMapper conversion from Dto to Model.
What is the correct way of implementing server side pagination, sorting and filtering for Kendo UI Grid, Web API and Automapper(conversion from dto to model)?
Hi,
do you have any solution with Kendo UI to produce a simple Dual List Box like e.g. http://www.virtuosoft.eu/code/bootstrap-duallistbox/ ?
MultiSelect is fine, but if you have longer lists it is not viable. A dual list box does the same Thing as MultiSelect, but is much more intuitive and clear. Any hints are welcome. Thanks!
Best regards
Martin
I got some extra div showing in the scheduler view. Anyone knows why?
the three little very thin bars are not any of my events.
I have a Kendo Editor defined as below:
@(Html.Kendo().Editor()
.Name("RestrictionsEditor")
.Tag("div")
.Tools(tools => tools
.Clear()
.Bold().Italic().Underline().Strikethrough()
.JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
.CreateLink().Unlink()
.InsertImage()
.TableEditing()
.FontColor().BackColor()
)
.Value(@<text><p>This is readonly editor initially and only gets in edit mode after button is clicked</p></text>))
Below is how I am making the Editor as readonly:
<script type="text/javascript">
$(function () {
var editor = $("#RestrictionsEditor").data("kendoEditor"),
editorBody = $(editor.body);
// make readonly
editorBody.removeAttr("contenteditable").find("a").on("click.readonly", false);
})
</script>
I want to get editor in 'Edit' mode only when a button is clicked. Below is how I am defining my button:
<button class="btn-sm" id="edit">Edit</button>
I have defined my button just before initializing Kendo Editor.
And below is how I am trying to get the editor to edit mode:
<script type="text/javascript">
$("#edit .btn").click(function () {
var editor = $("#RestrictionsEditor").data("kendoEditor"),
editorBody = $(editor.body);
editorBody.attr("contenteditable", true).find("a").off("click.readonly");
})
</script>
Now, when I run application my editor is in read only and when I click 'Edit' button, editor doesn't gets in edit mode and instead as soon as I click button, I m directed to the original page. Forgot to mention, my editor is inside a tab, which is inside of a modal.
Can you tell me where I am doing wrong and how can I acheive th
Thanks!
I've tested in Chrome (49.0.2623.112 m), Firefox (45.0.2), IE 11 (11.212.10586.0), and MS Edge (25.10586.0.0).
I'm having to programmatically resize some parent panes and a vertical splitter, it would be nice to bind that event and call my resize function there.
And while the contentLoad event doesn't appear to be working, the resize event does fire.
I'd also like to note that the kendoSplitter loads beautifully in IE 11.
Thanks!