Focus on selection after delete.

I have made an example from one of yours, for explanation.

The issue is that I want the grid to have a selected row at all time, so the user dont need to use mouse, that is not a problem as long as the user not delete the first row, try to select the first row and press the button delete row, there is now not a selected row anymore and I cant bring it back with :

obj.setSelectedRows([0]);
obj.setCurrentRow(0);
obj.setScrollTop(0);

The user can bring the selection back by using the mouse, but that is not a solution as this is only a simple example, the problem is the application needs the selection at all time.

Example :

<html>
<head>
<link href="ActiveWidgets/runtime/styles/xp/aw.css" rel="stylesheet"></link>
<script src="ActiveWidgets/runtime/lib/aw.js"></script>
</head>
<body>
<style>

</style>
<script>

var obj = new AW.UI.Grid;

obj.setSize(600, 250);
obj.setCellText(function(i, j){return j + "-" + i});
obj.setHeaderText("header");

obj.setColumnCount(10);
obj.setRowCount(100);

obj.setSelectionMode("single-row");

document.write(obj);

obj.onRowAdded = function(row){
window.status = "Row added: " + row;
this.setCellText("new", 0, row);
}

obj.onRowDeleting = function(row){
return !confirm("Delete row " + row + "?");
}

obj.onRowDeleted = function(row){
window.status = "Row deleted: " + row;
}

// row index
var serial = 1000;

function add(){
obj.addRow(serial++);
}

function del(){
var i = obj.getCurrentRow();
obj.deleteRow(i);
if (i==0) {
obj.setSelectedRows([0]);
obj.setCurrentRow(0);
obj.setScrollTop(0);
}
}

obj.setSelectedRows([0]);
obj.setCurrentRow(0);
obj.setScrollTop(0);
</script>
<br>
<button onclick="add()">add row</button>
<button onclick="del()">delete row</button>

</body>
</html>

Flaffer

July 27,

The grid does not physically delete the row but instead keeps an array of indices that contains the indexes into the actual data. I believe the indices array is only created when the data is updated (rows sorted, added(?), deleted). The delete function below takes the indices array into account. Note that the indices array is initialized to "", not null.

function del(){
    var i = obj.getCurrentRow();
    var a = obj.getRowIndices();
    var firstRow = (a == "" && i == 0) || a[0] == i;
    obj.deleteRow(i);
    if (firstRow) {
        var	a = obj.getRowIndices();
        obj.setScrollTop(a[0]);
        obj.setCurrentRow(a[0]);
        obj.setSelectedRows([a[0]]);
    }
}

Bryn

July 28,

Thanks Bryn

Flaffer

August 1,

This topic is archived.

Focus on selection after delete.

See also:

Search

New Data Grid

Version 2