<div class="content-container-fluid">
<div class="row">
<div class="cols-sample-area">
<div id="Grid" data-bind="ejGrid: {
dataSource: dataSource,
-----------------
columns: [
{ field:'id', headerText: 'Identifier', isPrimaryKey: true, isIdentity: true, type: 'number' },
{ field:'name', headerText:'Name' }
],
queryCellInfo:queryCellInfo,
-----------
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
var models = [];
for (var i = 0; i < 10; i++) {
models.push({ id: ko.observable(i), name: ko.observable("Name " + i)});
}
window.employeeView = {
dataSource: ko.observableArray(models),
queryCellInfo: ko.observable(function (args){
var val = args.data[args.column['field']];
if(ko.isObservable(val))
args.cell.innerHTML = val();
})
};
ko.applyBindings(employeeView);
});
</script> |
$.ejObservableToProperty = function (vm, propertyCollectionName) { /// <summary>Adds the observable properties of an encapsulated object to the target with get/set access</summary> /// <param name="vm" type="Object">The target object to receive the properties</param> /// <param name="propertyCollectionName" type="Object">The source object with observable properties</param> var properties = vm[propertyCollectionName]; $.each(properties, function (n, v) { if (ko.isObservable(v)) { Object.defineProperty(vm, n, { get: v, set: v }); } }); };
For property allowEditing, we don't change this property from our source. So, here we only have one way communication i.e., application changes will be notified to us. For this purpose, particular property is not required to be Observerable. It handled through KO's bindingHandlers change event.