KO Rows

by brianlmerritt

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
<button data-bind="click: createRows">Create</button>
<table>
<tbody data-bind="foreach: rows">
      <tr>
          <td data-bind="text: numbers[0]"></td
          <td data-bind="text: numbers[1]"></td>
          <td data-bind="text: numbers[2]"></td>
          <td data-bind="text: numbers[3]"></td>
      </tr>
</tbody>
</table>

JavaScript

RowModel = function(numbers) {
    var self = this;
        self.numbers = numbers;
}

TableViewModel = function() {
    var self = this;
        self.rows = ko.observableArray([]);

    self.createRows = function() {
				
        var arr = [];
        var numbers = [];
        for(var i=0; i < 100; i++){
            for(var p=0; p < 4; p++){
                numbers[p] = p;
            }
            arr[i] = new RowModel(numbers);
        }
        self.rows(arr);
    }
};
ko.applyBindings(new TableViewModel());