JSFiddle - React, Tailwind, and code Playground

by stratdaz

HTML

<link rel="stylesheet" href="https://github.com/benschulz/ko-grid-bundle/blob/master/dist/ko-grid-bundle.css">
<script src="https://knockoutjs.com/downloads/knockout-3.5.0.js"></script>
<script src="https://github.com/benschulz/ko-grid-bundle/blob/master/dist/ko-grid-bundle.js"></script>
<div class="gridStyle" data-bind="koGrid: gridOptions"></div>

CSS

.gridStyle {
    border: 1px solid rgb(212,212,212);
    width: 400px; 
    height: 300px
}

JavaScript

function mainVm(){

    var self = this;
    this.myData = ko.observableArray();

    this.gridOptions = {
      config: { },
    	data: self.myData,
      columnDefs: [
      	{ field: 'name', displayName: 'Name'},
        { field: 'age', displayName: 'Age'}]
     };
  
    this.changeData = function() {
                self.myData([
                    { name: "tof", age: 17 },
                    { name: "tif", age: 18 } ]);
    };
};
ko.applyBindings(new mainVm());