View Full Version : deleting all grid rows, cannot add more (0.33, ArrayData)

5 Feb 2007, 4:14 PM
Hi all,

using the grid component of yui-ext.0.33 with array data (preloaded, much like the example in the documentation), after deleting all rows in the grid, all attemtps to add new rows fail with the error message : "Index or size is negative or greater than the allowed amount", location yui-ext.js, line 585
Actually, the deletion operation itself cannot be completed, but you can wrap the dataModel.removeRow() call into a try-catch and get over with it.

The closest issue I could find to this situation is:

I'm using FF.1.5 and all default models (i.e. dataModel, columnModel, selectionModel, etc).

A workaround is to check before deletion that the grid will be empty and replace with empty values instead of actually deleting the row. Of course, now you have to check (at add operation) that the first row is empty and delete it. Rather a tedious houseceeping.

So far this is the only setback I have encountered in the otherwise excellent yui-ext library,

Thanks a lot Jack.

5 Feb 2007, 6:44 PM
If you're calling removeRow in loop from 0 to n, you're going to run into problems b/c eventually your index is going to be greater than number of items left in the array. You wrapped the failed removeRow call and continued - you don't know what the state of the array is.

Instead try calling removeAll

6 Feb 2007, 1:05 AM
Hi tryanDLS,

the problem is that the user can press the "delete" button as many times as he wishes and that's it. So eventually, the delete button will be pressed even if there is only one row left.

You are suggesting, that I should use removeAll instead of removeRow when there is only one row left? I'll try this and let you know. Anyway, I've implemented the workaround I refer to in my first post and all is well.


6 Feb 2007, 10:37 AM
Well, I tried using removeAll() instead of removeRow(). Now the deletion of the last row is done correctly, but the problem with adding new rows remains. Namely, you cannot add a new row anymore. The new error msg, is :

"this.data[rowIndex] has no properties", yui-ext.js, line 528

I've managed to code around this bug by not allowing the grid to ever become empty. See post above.

thanx anyway

6 Feb 2007, 11:05 AM
You might want to review and/or post your code. I just tested this and it works fine.

// assuming btnclick is a handler for something to trigger delete, and dm is the datamodel
btnClick: function() {
if (dm.getRowCount() > 0) {
else {
dm.addRow([newRowIndex, 'Maine', 'ME', true]);

6 Feb 2007, 1:45 PM
In my case, the code is rather complicated. I'll try to simplify it and post an example.

What I'm doing is that row actions (delete/add/insert) can be triggered from events both internal to the grid and from other parts of the application. I am not looping through the grid to delete all rows. I have separate functions for each row action and each function gets called through a combination of user actions (i.e. pressing a button which is external to the grid), a condition depending on row selection and/or data received through XHR. Furthermore, the functions to do row actions are common to more than one grids showing on the page and a reference to the 'active-grid' is passed to them. And before you ask, no the functions are not called concurrently.

Surely such a scenario is rather complicated, but all works flawlessly, except for the case when all rows of the grid get deleted.

thanx for your time.

6 Feb 2007, 2:18 PM
Well, I'm posting the code of what I'm trying to do. Hope it makes sense...

Step 1: Keep a reference to the grid I'm acting on, i.e. 'active_grid'

var active_grid = { 'grid':grid, 'rowIndex':rowIndex };

Step 2: the delete funtion (part of)

MY.deleteFunction = function() {
var ag = MY.getRuntimeValue('active_grid');
var g = ag['grid'];
var dm = g.getDataModel();
if (dm.getRowCount()!=1) {
try { dm.removeRow(ag['rowIndex']); } catch (e) { };
if (g.getSelectedRowIndex()<0) {
if (g.getSelectedRowIndex()<0) g.getSelectionModel().selectFirstRow();
} else {
try { dm.removeAll(); } catch (e) { };

I'm using removeAll as tryanDLS suggested. No problems here. Repeatingly calling this function will eventually delete all rows from the grid

Step 3: the add function (part of)

MY.addFunction = function() {
// -- application logic...
var ag = ISIS.getRuntimeValue('active_grid');
var g = ag['grid'];
var dm = g.getDataModel();
var newVals = new Array();
// -- more application logic putting new values into newVals array
// the length of newVals array will match the number of grid columns

Well, the 'dm.addRow(newVals)' statement cannot complete!

MY.deleteFunction() and MY.addFunction() are declared outside the grid definition.

Hope it helps you identify the problem.

thanx a lot.

6 Feb 2007, 4:11 PM
I would suggest you use the debug version of code and set BPs in removeRow and addRow.

removeRow can't fail unless you're passing an invalid index, or you've somehow corrupted the internal array. Either way, you should be able to verify in removeRow that the index arg is not bigger than the size of this.data.

Similary in addRow, you should be able to tell whether you row is getting successfully appended to this.data, or it's failing further along the line.