Hi,
the grid popup editor window's close event is fired twice when closing the popup window via the close button (not the cancel or save button).
See this dojo: http://dojo.telerik.com/IdIYe
Even using the "one" binding produces a duplicate event:
edit: function (e) { e.container.data("kendoWindow").one("close", onEditorClosed);}I depend on this event being fired only once, because I'm trying to fix my previous issue with flashing nested modal windows (http://www.telerik.com/forums/avoid-overlay-flash-with-nested-modal-windows).
I tried to debug the code: _close() of window is called twice, once via _windowActionHandler() and once via _destroyEditable() -> close(). The strange thing is that both code paths seem to operate on different _events objects. The first code path calls and removes the "one" event handler from _events, but on the second path, _events appears to be unchanged, i.e. the "one" event handler is still there and called again.
Any clues? Looks like a bug to me.
Regards
Kasimier Buchcik

I have a tree list with 2 parents nodes, I wonder if there's any way when I click within the parent box happen the same effect that happens when I click the arrow to open the children items
Here is the config of my tree list
$scope.treelistOptions = { dataSource: { data: $scope.treeData, schema: { model: { fields: { id: { type: "integer", editable: false, nullable: false }, parentId: { field: "parentId", nullable: true, type: "integer" } }, expanded: true } } }, columns: [ { field: "operationCode", title: "Descrição", attributes: {"class": "colorFirstColumn"}, template: "<strong>#: operationCode #</strong>"}, { field: "qtdTotalCompra", title: "MWm"}, { field: "valorTotalCompra", title: "R$"}, { field: "qtdTotalVenda", title: "MWm"}, { field: "valorTotalVenda", title: "R$"}, { field: "valorTotalBalanco", title: "Balanço"}, { field: "valorResultado", title: "Resultado"} ], sortable: false, reorderable: false, resizable: true, columnMenu: false };Hi,
I was wondering what is the best way to implement the repository pattern with the kendo grid filtering server side.
I know we can use the IQueryable interface but is not the best pratice to do this in your repository pattern.
I took a look at the DataSourceRequest parameter passed in my web api controller.
I wonder how I can convert the Kendo Filter object to use them in my repository pattern and if this is possible ?
Thanks

I have a page with a combo box to select a type and two date pickers (start date and end date).
The user selects a type, both dates and clicks on a load button.
The request retrieves data from all types in this date range.
And I'm using a filter in a data source to display on a grid only the records of the type selected by the user (relevant information of the data response).
Code:
$("#loadButton").kendoButton({ click: loadGrid});var loaded = false;function loadGrid(e) { if (type) { if (loaded) { var grid = $("#grid").data("kendoGrid"); grid.wrapper.empty(); grid.destroy(); } $("#grid").kendoGrid({ scrollable: false, editable: false, autoBind: false, dataSource: dataSource, columns: [], // omitted }); var typeString = kendo.toString(type); $("#grid").data("kendoGrid").dataSource.filter({ logic: "or", filters: [ { field: "type", operator: "startswith", value: "-1" }, { field: "type", operator: "startswith", value: typeString } ] }); loaded = true; } else { e.preventDefault(); alert("Select a type!"); }}function getData() { return { type: type, startDate: kendo.toString(pickerStart.value(), "yyyy-MM-dd"), endDate: kendo.toString(pickerEnd.value(), "yyyy-MM-dd") }; }var dataSource = new kendo.data.DataSource({ transport: { read: { url: url", dataType: "json", data: getData } }, schema: { total: "total", data: "list" }, group: { field: "date" } });
If the user selects a different type, the data in the data source is filtered and it works fine.
The problem is that, if the user selects a different date, a new request should be done to get the new data and then filtered by type as it already does.
Right now, if the user selects a different type, the data is filtered, but if the user selects a different date, nothing happens.
Can someone tell how to handle this situation?
Am I using it wrong?
Thanks!
Hello,
I see there is a way for a user to export the spreadsheet to Excel but I am looking for a way to programmatically save to a folder on the server. Is this possible?
Thanks.
I have a Kendo Grid on the page. When the user clicks a button, I want to send the rows (data objects) from the grid to the controller. The controller will return a partial view, which will be used as the content for a new window. I've got the window load from a partial view working using .refresh({url:}), but I'm having trouble getting the grid data sent. Seems like I should be able to use something like this, but it's not working for me:
dialog.refresh({
url: "/Controller/Action",
data: JSON.stringify({items:$("#grid").data("kendoGrid").dataItems}),
dataType: "json",
type: "POST",
contentType: 'application/json; charset=utf-8'})
On the controller I have the items parameter defined as IEnumerable<Item> but it gets a null value.
I am a beginner working on Kendo Grid. I wanted to load the data on demand in the grid, like :
I set the page size to 10, when a user scrolls down to 10 rows, the
grid should retrieve next 10 rows from database and display it on
demand.To do this, I changed "scrollable: true" to "scrollable: {virtual: true}". But this disables scrolling in the grid.
$scope.source = new kendo.data.DataSource({ batch: true, group: getDSGroup(), transport: { read: userSvc.getUserList, update: _dataUpdateItem }, error: function (e) { ngDialog.openConfirm({ template: 'httpErrorDialogId', className: 'ngdialog-theme-default', data: { 'status': e.status, 'message': e.errorThrown } }); }, schema: { parse: function (data) { $rootScope.$log.log("User list was fetched."); if ($rootScope.sysSettings.userMgr_serverPaging) return data; for (var i = 0; i < data.items.length; i++) { data.items[i].letter = data.items[i].lastName.substr(0, 1).toUpperCase(); if (data.items[i].departmentName == null) data.items[i].departmentName = $rootScope.$translate.instant("Unassigned"); if (data.items[i].userGroupName == null) data.items[i].userGroupName = $rootScope.$translate.instant("Unassigned"); } return data; }, model: { id: "id" }, groups: "groups", total: "totalItems", data: "items" }, filter: getDSFilter(), sort: getDSSort(), pageSize: $rootScope.sysSettings.userMgr_serverPaging ? 10 : 0, serverGrouping: $rootScope.sysSettings.userMgr_serverPaging, serverPaging: true, serverSorting: $rootScope.sysSettings.userMgr_serverPaging, serverFiltering: $rootScope.sysSettings.userMgr_serverPaging }); $scope.userListOptions = { //sortable: true, groupable: true, selectable: false, //pageable: true, scrollable: { virtual: true }, //dataBound: function() { // this.expandRow(this.tbody.find("tr.k-master-row").first()); //}, columns: [{ field: "firstName", template: kendo.template($("#tpl-UserItem").html()) }, { field: "letter", hidden: true, groupHeaderTemplate: "#= value #" }] }; $scope.isEndlessScroll = function () { return $rootScope.sysSettings.userMgr_serverPaging; };I have a Kendo grid which fetches data from a REST endpoint. Until now, it's had a fixed height, and everything is golden.
Now I'm trying to make it fill its parent div's height. I've gotten that to work via suggestions in other threads in this forum; essentially:
$(window).resize(() => { const grid: any = $('.grid-selector').data('kendoGrid'); grid.resize(true);});This does allow the grid to fill its parent div's space - great. Unfortunately, there is an occasional hiccup with the displayed rows. The most common issue that I see is the following:
Say I have a grid with rowCount: 20, displaying a data set with size === 500. (Server paging is enabled, in case that is important). If the window is sized such that < 20 rows are visible at any one time, the UI looks as expected - the grid's viewport is filled with rows, and I can scroll through them and see them all.
If I then resize the window such that > 20 rows should be visible, I instead see only 20 rows, with whitespace at the bottom of the grid's viewport. Further, I never see the "last few rows" of data - as if the grid component expects the rows in the whitespace to be painted when they aren't. Viewing network traffic, it appears that the grid is indeed making queries for data correctly, it's strictly a visual glitch.
If I set rowCount to something larger than I expect any user to see on the screen at a time (say 100), the UI appears to function properly again - I never see whitespace within the grid's viewport. I'm nervous that this is masking a problem though, not fixing it, and there may still be an issue.
Hopefully that made sense. I'm attaching a screenshot showing the problem. Is there something else I have to do to trigger a complete re-rendering, and possible re-fetching, of data on resize events?
Why this code does not set the value to input element?
<input id="datePicker" /><script> $(document).ready(function(){ $("#datePicker").kendoDatePicker({ value: new Date(), min: new Date()})});</script><button>SetNewValue</button><script> $('button').on('click',function(){var dp = $("#datePicker").data('kendoDatePicker'); dp.value(new Date(2016,1,1))})</script>
If I change date to "new Date(2016, 4, 1)" value will be set correctly. The error appears in all browsers.
Link to JSbin example http://jsbin.com/catolumifa/edit?html,output

Hi
I have a grid with check box, on checking the checkbox and clicking a button on the screen, i want to remove the selected row.
i am using the below code, everything works fine if i have only one page but if i have multiple pages in grid, the other pages selected rows are not deleted.
This code is written in the click event of button.
var grid = $("#grdSelect").data("kendoGrid");
grid.tbody.find("input:checked").closest("tr").each(function (index) {
grid.removeRow($(this).closest('tr'));
});
grid.refresh();
Please help.