validating single column then setting focus to next row
I've been searching the forum, and haven't been able to "merge" the various pieces to get a solution that actually works.
The grid I am using has 200 rows, and the user is allowed to enter a value from 1-7 in each row. an
What I want to do is the following, the first column of the grid is editable, but should only take values from 0-7; once a value is entered I want it to update a counter variable, and then have it automatically set the focus to the next row in "edit" mode. I have at least tried to capture two functoins, a cell validating function that verifies the value are within 0-7, and then the cellvalidated function should change the background color to green (to let the user know they are "done" with that row) and then automatically start editing the next row. I realize this code is very dirty--- I've just been trying so many different iterations I apologize...
obj.onCellValidating = function(text, ,column, row){
document.card_counter.currentrowindex.value = row;
document.card_counter.currentcolumnindex.value = column;
if(text.value < 0 || text.value > 7 )
{
return "error";
}
else
{
obj.setCurrentColumn(column);
obj.setCurrentRow([row+1]);
obj.raiseEvent("editCurrentCell",{});
}
}
obj.onCellValidated = function(event, column, row){
try {
var template = this.getRowTemplate(row);
// this doesn't do anything but will retain the color change
// if the control gets deactivated
template.setStyle("background", "green");
// this is the line that actually changes the row color for me
template.element().style.backgroundColor = "green";
} catch(e) {alert(e) }
update_card_counter();
}
The grid I am using has 200 rows, and the user is allowed to enter a value from 1-7 in each row. an
What I want to do is the following, the first column of the grid is editable, but should only take values from 0-7; once a value is entered I want it to update a counter variable, and then have it automatically set the focus to the next row in "edit" mode. I have at least tried to capture two functoins, a cell validating function that verifies the value are within 0-7, and then the cellvalidated function should change the background color to green (to let the user know they are "done" with that row) and then automatically start editing the next row. I realize this code is very dirty--- I've just been trying so many different iterations I apologize...
obj.onCellValidating = function(text, ,column, row){
document.card_counter.currentrowindex.value = row;
document.card_counter.currentcolumnindex.value = column;
if(text.value < 0 || text.value > 7 )
{
return "error";
}
else
{
obj.setCurrentColumn(column);
obj.setCurrentRow([row+1]);
obj.raiseEvent("editCurrentCell",{});
}
}
obj.onCellValidated = function(event, column, row){
try {
var template = this.getRowTemplate(row);
// this doesn't do anything but will retain the color change
// if the control gets deactivated
template.setStyle("background", "green");
// this is the line that actually changes the row color for me
template.element().style.backgroundColor = "green";
} catch(e) {alert(e) }
update_card_counter();
}
david G
August 29,