2 datatables with the same columns object update the 1st table only

Webix JS
1

If remove webix.copy, the 1st table updated twice and the 2nd table is empty
(using webix-4.1.0).

<div id="app"></div>

<script type="text/javascript">
    var columns = [{id: "a", header: "A"},{id: "b", header: "B"}];
    webix.ui({ container: "app", view: "layout",
        rows: [
            {id:"tbl1", view: "datatable", columns: columns, autoheight:true, autowidth:true},
            {id:"tbl2", view: "datatable", columns: webix.copy(columns), autoheight:true, autowidth:true}
        ]
    });

    webix.ready(function() {
        $$("tbl1").data.importData([{id: 1, a: "a11", b: "b11"}, {id: 2, a: "a12", b: "b12"}]);
        $$("tbl2").data.importData([{id: 1, a: "a21", b: "b21"}, {id: 2, a: "a22", b: "b22"}]);
    });
</script>
2

Hi,

Thewebix.copy is a recommended way to re-use any objects in Webix components (especially the data), as the initialization of the original object can affect it. In fact, the most proper init is

rows: [
  {id:"tbl1", view: "datatable", columns: webix.copy(columns)},
  {id:"tbl2", view: "datatable", columns: webix.copy(columns)}
]