Bug in addRow() if datasource was empty

Here's the original example code. This works:

<script>

    var myData = [
        ["row 0", 0]
    ]

    var obj = new AW.UI.Grid;
    obj.setCellData(myData);
    obj.setColumnCount(2);
    obj.setRowCount(1);
    document.write(obj);

    function addRow(){
        // calc new row index
        var i = myData.length;

        // add row to the datasource
        myData[i] = ["row " + i, i];

        // update grid
        obj.addRow(i);
    }

    var button = new AW.UI.Button;
    button.setControlText("add row");
    button.onControlClicked = addRow;
    document.write("<br>" + button);

</script>

But change the declaration of myData to

var myData = [];

or

var myData = Array();

and instead of rows flowing down the grid, they flow across the grid sideways in a strage pattern.

It's taken me all morning to find the cause of this :-/

Any fix for this?

Here's a better example of it not working:

<script>

    var myData = [];

    var obj = new AW.UI.Grid;
    obj.setCellData(myData);
    obj.setColumnCount(10);
    obj.setRowCount(myData.length);
    document.write(obj);

    function addRow(){
        // calc new row index
        var i = myData.length;

        // add row to the datasource
        myData[i] = ["row " + i, i];

        // update grid
        obj.addRow(i);
    }

    var button = new AW.UI.Button;
    button.setControlText("add row");
    button.onControlClicked = addRow;
    document.write("<br>" + button);

</script>

Yes, this is the bug in js datasource logic - using myData=[] breaks it, so you should possibly use something like myData=[[]] and replace it with the first row.