Demo - FlexGrid

HTML

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://cdn.wijmo.com/5.latest/styles/wijmo.min.css">
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.min.js"></script>
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.input.min.js"></script>
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.grid.min.js"></script>
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.grid.filter.min.js"></script>
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.gauge.min.js"></script>
<div class="container">

  <div id="gridDefault">
  </div>      
  
   <div id="log">
    &nbsp;
  </div>

</div>

CSS

.wj-flexgrid {
  max-height: 250px;
  margin-bottom: 12px;
}
.header {
  display: inline-block;
  width: 150px;
  text-align: right;
  font-weight: normal;
}

JavaScript

function showMessage(msg) {
  	var d = new Date();
  	elLog.innerHTML = d.toLocaleTimeString() + " " + (msg.indexOf("Set")== 0 ? "<b>" + msg + "</b>" : msg) + "<br/>" + elLog.innerHTML;
    console.log(msg);
  }

var CountryInfo = function(id, country, active, downloads, sales, expenses) {
	this._id = id;
  this._country = country;
  this._active = active;
  this._downloads = downloads;
  this._sales = sales;
  this._expenses = expenses;
}

Object.defineProperty(CountryInfo.prototype, "id", { 
	get: function(){
  	showMessage("Get Id " + this._id);
  	return this._id;
	},
  set: function(val) {
  	this._id = val;  	
  },
  enumerable: true,
  configurable: true
});

Object.defineProperty(CountryInfo.prototype, "country", { 
	get: function(){
  	showMessage("Get Country " + this._country);
  	return this._country;
	},
  set: function(val) {
  	this._country = val;  	
    showMessage("Set Country " + this._country);
  },
  enumerable: true
});

Object.defineProperty(CountryInfo.prototype, "active", { 
	get: function(){
  	showMessage("Get Active " + this._active);
  	return this._active;
	},
  set: function(val) {
  	this._active = val;  	
    showMessage("Set Active " + this._active);
  },
  enumerable: true
});

Object.defineProperty(CountryInfo.prototype, "downloads", { 
	get: function(){
  	showMessage("Get Downloads " + this._downloads);
  	return this._downloads;
	},
  set: function(val) {
  	this._downloads = val; 
    showMessage("Set Downloads " + this._downloads);
  },
  enumerable: true
});

Object.defineProperty(CountryInfo.prototype, "sales", { 
	get: function(){
  	showMessage("Get Sales " + this._sales);
  	return this._sales;
	},
  set: function(val) {
  	this._sales = val; 
    showMessage("Set Sales " + this._sales);
  },
  enumerable: true
});

Object.defineProperty(CountryInfo.prototype, "expenses", { 
	get: function(){
  	showMessage("Get Expenses " + this._expenses);
  	return this._expenses;
	},
  set: function(val) {
  	this._expenses = val;...