I am working on Angular UI grid and I am trying to change the cell template property on button click but it is not affecting the UI grid.
Here is the punker and when I click on toggleDisplay name it is not getting changed.
check link:-
plnkr.co/edit/Q0WcJC37bSGF7Huet39Q?p=preview
Related
I am trying to prevent new data from refreshing my Kendo chart while the user is hovering over a tooltip.
My current solution is to use a $timeout of 5 seconds after the tooltip is drawn inside getTooltip(e) and using a flag to switch between pauseUpdate and !pauseUpdate.
Does Kendo provide a way to track when a tooltip gets shown on the screen and when it gets destroyed?
My problem is how I can get the dataItem(row) where a cell was updated.
The column is a dropdown menu.
It seems dataBind is not functioning well.
I am using kendo grid and angularjs in this project.
Here is a sample demo.
Try using change event of grid dataSource there you can get the current modified dataItem with updated data
change:function(event) {
}
In the above code event will be having the updated dataItem
I am trying to bind a Kendo UI Grid to an object on $scope instead of to kendo.data.dataSource. The grid shows the data (which is in the object) but if I change the data or add new row, the changes are not reflected in the $scope object. Why is that?
My real problem is, I want to show two grids top & bottom and when the user selects a row from top grid, the bottom grid should be populated with the details. However, these details are already fetched and kept in the DataSource of the top grid (hence no transport section for bottom grid) because I want to be able to save any changes in batches.
This is how I am binding my grids
Top Grid
<div kendo-grid="mainGrid"
k-sortable="true"
k-editable="true"
k-selectable="'row'"
k-filterable="true"
k-resizable="true"
k-scrollable='{ "virtual":true }'
k-on-change="selected = dataItem"
k-options="mainGridOptions"
k-height="165">
</div>
Bottom Grid
<div kendo-grid="detailGrid"
k-editable="true"
k-selectable="'row'"
k-options="detailGridOptions"
k-data-source="selected.Details"
k-height="125"></div>
This is how I add record to bottom grid
$scope.detailGrid.dataSource.add();
So far, I didn't get how to bind Kendo UI grid to an object on $scope. However, for my real problem, I have found a work around.
I bound on-save event of the child grid, and explicitly marked the current row as dirty.
$scope.onDetailGridSave = function () {
$scope.selected.dirty = true;
};
and in HTML
k-on-save="onDetailGridSave()"
I am creating a custom angular directive to disable elements like input,anchor,button etc for a page containing kendo grids...
Directive works fine on other elements but not on kendo grids...few columns of the grid is having anchor tags need to disable them...
My question here is
How to apply custom logic present in my directive after kendo grid render completed...by emiting or broadcasting some action on databound event or etc...or by watching a rootscope value and changing it...
What would be the best approach i can take...will update the question soon with some codes...posting this from mobile...
I am using ng grid and each row of the grid have a text box. I want to access all the textbox inside and outside of the grid using TAB Key according to provided tabIndex.
My plunker is here : http://plnkr.co/edit/ce4xnHJtYhRdwe6JvZSA?p=preview
set noTabInterference: true in gridOptions, updated recently