http://stackoverflow.com/questions/43085042/dynamically-bind-the-data-bind-attribute-in-knockout
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script>
<div class="container" id="dashboard-form">
<table style="width:100%" id="summaryInformation" class="dt-table">
<thead>
<tr>
<!--ko foreach: FilteredColumns-->
<th data-bind="text: Caption, attr: {'data-property': Name,'data-logicaloperation': DataLogicaloperation}">
</th>
<!--/ko-->
<th></th>
</tr>
</thead>
<tbody data-bind="foreach: FilteredRecords">
<tr data-bind="foreach: $parent.FilteredColumns">
<td style="border: 1px solid green;">
<span data-bind="applyBinding: DataType, bindingTarget: $parent.myValue"></span>
</td>
</tr>
</tbody>
</table>
</div>
JavaScript
var columns = [
{Name: 'MachineNo', Caption: 'Machine No', Selected: false, DataLogicaloperation: '', DataType: 'numeric'},
{Name: 'Side', Caption: 'Side', Selected: false, DataLogicaloperation: '', DataType: 'text'},
{Name: 'Status', Caption: 'Status', Selected: false, DataLogicaloperation: '', DataType: 'text'},
{Name: 'Count', Caption: 'Count', Selected: true, DataLogicaloperation: "Count", DataType: 'numericText'},
{Name: 'CountLabel', Caption: 'CountLabel', Selected: true, DataLogicaloperation: '', DataType: 'text'}
];
function DashBoardVM() {
var self = this;
self.Columns = ko.observableArray(columns);
self.FilteredRecords = ko.observableArray([
{myValue: 500},
{myValue: 600},
{myValue: 700}
]);
self.FilteredColumns = ko.computed(function(){
return self.Columns().filter(function(e){return e.Selected;}) || [];
});
self.getBindingFor = function(rowData, column){
var obj = {};
obj[column.DataType] = rowData;
return obj;
}
/*
//This is called every one minute
self.Refresh = function() {
$.ajax({...});
}
*/
}
$(function() {
var dashBoardVM = new DashBoardVM();
ko.bindingHandlers.applyBinding = {
init: function(element, valueAccessor, allBindingsAccessor, data, bindingContext) {
var bindingName = ko.unwrap(valueAccessor());
var target = ko.unwrap(allBindingsAccessor().bindingTarget);
if (bindingName) {
var binding = {};
binding[bindingName] = function() {
return target;
};
ko.applyBindingAccessorsToNode(element, binding, bindingContext);
}
}
}
ko.bindingHandlers.numericText = {
init: function (element, valueAccessor, allBindingsAccessor) {
//element -> value
ko.utils.registerEventHandler(element, "change", function () {
var target = valueAccessor();
var newValue = $(element).val();
if...