I'm stuck adding a new row to a empty grid based on array
This code taken from Alex from this forum:
function addRow(){
var rowData = ["GGL", "Google, Inc", "9,999.999", "765.432", "10000"]
myData.unshift(rowData);
obj.setRowProperty("count", myData.length);
obj.refresh();
}
works perfectly when my grid already contains rows. The model of my grid is array based.
But when the grid/array is empty, all I get is an empty new row on the grid. I have dumped the array and is empty, so the problem seems to be in pushing the data into the array, not in the grid I think.
Please help me, I'm stuck!!
Regards.
Martin Duran
April 28,
Not sure, this code works fine -
var myData = [];
var rowData = ["GGL", "Google, Inc", "9,999.999", "765.432", "10000"];
myData.unshift(rowData);
var obj = new AW.UI.Grid;
obj.setCellData(myData);
obj.setColumnCount(5);
obj.setRowCount(myData.length);
document.write(obj);
Alex (ActiveWidgets)
April 28,
Alex, I managed to write a complete example of this problem:
<html>
<head>
<script src="/runtime/lib/aw.js"></script>
<link href="/runtime/styles/xp/aw.css" rel="stylesheet"></link>
</head>
<style>
#theButton {width: 120px;}
#theGrid {width: 100%; height: 350px; }
#theGrid .aw-grid-control {height: 100%; width: 100%; margin: 0px; border: none; font: menu;}
#theGrid .aw-grid-row {border-bottom: 1px solid threedlightshadow;}
#theGrid .aw-column-0 {width: 150px; text-align: left; border-right: 1px dotted #ccc;}
#theGrid .aw-column-1 {width: 150px; text-align: left; border-right: 1px dotted #ccc;}
#theGrid .aw-column-2 {width: 150px; text-align: left; border-right: 1px dotted #ccc;}
#theGrid .aw-column-3 {width: 150px; text-align: right; border-right: 1px dotted #ccc;}
#theGrid .aw-column-4 {width: 150px; text-align: left; border-right: 1px dotted #ccc;}
#theGrid .aw-alternate-even {background: #fff;}
#theGrid .aw-alternate-odd {background: #eee;}
</style>
<script>
var myColumns = ["C1","C2","C3","C4","C5"];
var myData = [];
var obj = new AW.Grid.Extended;
obj.setId("theGrid");
obj.setHeaderText(myColumns);
obj.setCellData(myData);
obj.setColumnCount(myColumns.length);
obj.setRowCount(myData.length);
document.write(obj);
</script>
<body>
<input type=button value="Click to insert" onclick="
alert('Insert');
var rowData = ['GGL', 'Google, Inc', '9,999.999', '765.432', '10000'];
myData.push(rowData);
obj.setRowProperty('count',myData.length);
obj.refresh();
">
</body>
</html>
If you test this code "as is", you will start with an empty grid, then if you click the button you will get a new row but will all the values inside the first cell (I thought the row was empty because the first col is hidden in my app).
If you uncomment the myData declaration to start with a grid non empty you will see that the new row in inserted ok.
What am i missing?
Martin Duran
April 29,
I finally got it working. Bug? Feature?
I had to insert this:
obj.setCellData(myData);
every time I have to insert a row, so that in the case that the array was empty, the grid is filled correcty.
The complete code for the input button is:
<input type=button value="Click to insert" onclick="
alert('Insert');
var rowData = ['GGL', 'Google, Inc', '9,999.999', '765.432', '10000'];
myData.push(rowData);
obj.setCellData(myData);
obj.setRowProperty('count',myData.length);
obj.refresh();
">
Martin Duran
April 29,
When you assign an empty array the grid does not recognize that it is supposed to be two-dimensional array. Bug (?).
Alex (ActiveWidgets)
May 2,
I was finally able to figure this out as well, but if I add a few rows and then sort a column, and then try and add another row it fails. I get more rows added (I can see the scroll bar adjusting) but they do not have data in them. What else am I missing?
Thanks for your help.
Jack Yo
May 11,
I'm having the same problem when I assign an empty array to a grid. A row is inserted correctly, but when I get the values from grid the values are the original values and not the changed values. Also the onCellEditEnded event is not triggered. Any ideas?
Thanks!
Gary
August 18,