checkbox column not in tab order

[ralph1996]

When you set up a standard checkbox column with ediable: true and editor: false (which allows hte checkbox to be visible at all times instead of reverting the the text "true" and "false") teh cells in that column are not accessible in the tab order using nextEdit.

For example add:  editModel: {onSave: "nextEdit", onTab: "nextEdit"}  to the Auto Save Demo and you will see that if you open an edit in one of the text boxes and then continually tab through the controls, the checkboxes are skipped.  Since the checkboxes are an input they still need to be in the tab order.

I know if I set the editor to true or leave it undefined it will then tab into the cells, but as mentioned above it changes the checkbox to "true" or "false" text.  I can't think of any scenario when that is what you would actually want.

Of course we can create a renderer for the cell - but again it still does not solve the focus issue.

I have nto tried to wrte an actual editor for the column - maybe that is the solution.  But it seems that this should be standard berhavior of the checkboxes.

Any suggestions short of a fix for this would be appreciated. 

to

[ralph1996]

Well I partially solved my own problem, but there is still an issue.

I realized that if I set the colModel editor for the checkbox column to be  editor: {type: 'checkbox'} then the tabbing will work.  However if you do that and check the checkbox with the spacebar (keyboard as opposed to mouse) once you have tabbed into the control - the check event does not fire.

So given the Auto Save demo:
 Add editModel: {onSave: "nextEdit", onTab: "nextEdit"}
 Add check: function() { alert('checkbox'); },
Add to the checkbox column: editor: {type: 'checkbox'}
 

Then you can see that you can tab into the checkbox and select it with the keyboard, but the event does not fire.  However, if you click the checkbox with the mouse - the event fires.

One last thing:  If you add editModel : {clicksToEdit: 1 } to the column you get different behavior in Chrome vs. IE. In IE clicking on the checkbox immediately changes its state as well as gives it focus.  In Chrome clicking puts it in edit mode but does not change its state.  The ideal functionality is how IE is handling it.

[paramvir]

1. Checkbox columns are treated differently from normal editors, they are not tab able with onTab: 'nextEdit'

If you need tabbing order for checkbox columns, please use onTab: 'nextFocus'.

2. beforeCheck and check events fire only for checkbox columns i.e., column.type = 'checkbox', not for checkbox editors i.e., editor: {type: 'checkbox'}.

[ralph1996]

The issue for us is that we want to tab from editor to editor in the grid but the grid also contains checkbox columns. So using onTab: 'nextFocus' for the grid does not work since it will not automatically open the editor in other cells.

I tried playing around with the selectionModel and editModel onTab settings to see if I could set the cell prior to the checkbox to be onTab : 'nextFocus' and while it seemed to work tabbing into the checkbox, tabbing out of the checkbox to the next editor did not seem to work. I think this is because the checkbox cell is not actually in edit mode so the nextEdit does nto work for it.  The other issue with this is that the cells prior to the checkbox may be disabled or not based on teh state/content of other cells, so it can be a difficult process to keep track and make sure that the previous cell in the tab sequence  is the one using nextFocus as opposed to nextEdit.  We would have to change the onTab state of the columns on the fly - but that does not work if each row has different cells being enabled or disabled (using editable callback function to determine editable state based on content).

Unless I am missing something, there does not seem to be a consistent way to be able to tab through editors and mix checkboxes in the grid.

One thing that could work is to use nextFocus on all cells and add an onFocus handler  to force an edit when focus is received on non-checkbox columns.  However the API does not include a "cellFocus" or similar event.  Looking into the source code I see there is an onfocus event but I am not sure the best way to tap into that without actually replacing it which could cause issues upgrading to future versions.  Any suggestions?

Thank You