Posted 14 September 2017, 12:14 pm EST
Hi I want to update the row color when user edit the so that use can easily identify which rows are he edited.
I am using this code but it is not working
Can you tell us how can I do it
<!-- mark this as an Angular application and give it a controller –>
<div ng-app=“app” ng-controller=“appCtrl”>
<h1>Highlight Edited Cells</h1>
<p>This is a <b>FlexGrid</b> control. Edit some cells to see their background color change.</p> <wj-flex-grid items-source="data" initialized="initialized(s,e)"> </wj-flex-grid>
</div>
// define app, include Wijmo 5 directives var app = angular.module('app', ['wj']); // controller app.controller('appCtrl', function ($scope) { var row; var row1; // create some random data var countries = 'US,Germany,UK,Japan,Italy,Greece'.split(','), data = []; for (var i = 0; i < countries.length; i++) { data.push({ country: countries[i], downloads: Math.round(Math.random() * 20000), sales: Math.random() * 10000, expenses: Math.random() * 5000 }); } // expose data as a CollectionView to get events $scope.data = new wijmo.collections.CollectionView(data); // highlight cells that have been edited $scope.initialized = function (s, e) { // 1: keep track of edited cells s.cellEditEnded.addHandler(function (s, e) { row1=s.rows[e.row].dataItem; }); s.beginningEdit.addHandler(function (s, e) { row =JSON.parse(JSON.stringify(s.rows[e.row].dataItem)); }); // 2: change the background of edited cells s.itemFormatter = function(panel, r, c, cell) { // if (panel == s.cells) { // cell.style.backgroundColor = changeColor() ? '#e0e0e0' : ''; } } function changeColor() { if(row== undefined) return; if(row1!==row) { return true; } return false; } // utility to keep track of changed items } });
