0

I'm using an AdvancedDataGrid in ActionScript 3/Flex 4. The grid has 5 columns: Caller Intent, Labels, Strategy, Confirmation Mode, and Confirmation Promptlet. All columns are editable except for Labels. However, if you change the Confirmation Mode value to NEVER, the next column Confirmation Promptlet becomes uneditable and is set with the value 'n/a' (this is the desired functionality).

Screen in question

Unfortunately, the image is not clear. In the second row, I changed the Confirmation Mode value to NEVER. This is what happens when I start tabbing out of the Confirmation Mode cell: 1st Tab: Confirmation Promptlet populated with 'n/a'. I don't see anything in focus. 2nd Tab: The 5th tab from the left in the view stack (dark grey) is in focus. 3rd Tab: I don't see anything in focus. 4th Tab: The button with the green '+' (top left) is in focus. 5th Tab: The grid itself is in focus. 6th Tab: Finally I get to the Caller Intent cell of the next row (when this image was captured)

I tried setting tabEnabled="false" and tabFocusEnabled="false" for the button. I set only tabFocusEnabled="false" for the AdvancedDataGrid. But then the Tab focus starts moving to the components in the upper right panel and lower right panel.

I need to accomplish 2 things: 1. Have tabbing be contained in the grid, in the upper right panel, and in the lower right panel. Meaning tabbing should not cross from one area to another. 2. Have an uneditable field not mess up the normal tabbing behaviour.

Sam
  • 7,252
  • 16
  • 46
  • 65
bon_t
  • 97
  • 1
  • 7

2 Answers2

0

SIMPLE SOLUTION: Use ENTER to transverse down a grid.

COMPLEX SOLUTION: Use a combination of event listners, and locking /unlocking of other columns.

Whithin the MXML file, you can edit the DataGridColumn (or do it with code), to do your setup. 

<mx:DataGridColumn ... id='col1' editable='false' ... />

Though i know you said this does not work, you can when a user, selects a column, lock out ALL OTHER COLUMNS and make them uneditable (via code + DataGridColumn's with id). As a result, all tab events goes 'one step down'. However make sure to catch the exiting edit event, when all edits are canceled. To 'unlock' all the other collumns. As a proof of concept, try creating a table with only 1 editable collumns

Use event listner to intercept the edits start and end (hence ignores it / etc)

//...
datagrid.addEventListner( DataGridEvent.ITEM_EDIT_END, editEvent );
function editEvent( e.DataGridEvent ):void {
    if(e.reason == DataGridEventReason.CANCELLED) {
        e.preventDefault();
    }

    if(e.dataField == 'collumn name i dun want to edit') {
        e.preventDefault();
    }
    //...
    //CODE TO LOCK / UNLOCK EDIT IN OTHER COLLUMNS
    //...
    //you may want to add an ignore, if both before / after values are the same
    //If you really need that code : i can dig it up (just let me know)
}

In this way, you can just transverse down the grid, by entering the ENTER key. (and ignore edits when not needed). And catch the event needed to lock out the other grids.

PicoCreator
  • 9,886
  • 7
  • 43
  • 64
  • Hi, I'm sorry, I don't quite follow your proposed solution. However, I need to provide both the Tab and Enter functionalities. The Confirmation Promptlet column becomes uneditable only under certain conditions. Otherwise, it remains editable and no issues occur with tabbing. – bon_t Jun 13 '11 at 15:27
  • I solved my issue by explicitly setting the editedItemPosition to the next cell to be edited in this scenario: adg_mappedTagsList.editedItemPosition = { columnIndex:0, rowIndex:adg_mappedTagsList.selectedIndex+1 }; – bon_t Jun 13 '11 at 22:18
  • @bon_t: Ahh, so do u mean u set up an event listner for the edit complete... And shifted the edited position down? That's slick lol, I didn't thought that would work as the item was not being edited. But thinking logically again, the editor will fire again on the value change... – PicoCreator Jun 14 '11 at 12:32
  • I solved my issue by explicitly setting the editedItemPosition to the next cell to be edited in this scenario: adg_mappedTagsList.editedItemPosition = { columnIndex:0, rowIndex:adg_mappedTagsList.selectedIndex+1 }; – bon_t Jun 14 '11 at 19:13
  • Sorry about duplicating that comment. Pls ignore. – bon_t Jun 14 '11 at 19:15
0

I have done a lot of focus work around the AdvancedDataGrid. Check out my presentation at http://squaredi.blogspot.com/2011/04/taming-beast-advanceddatagrid.html and http://squaredi.blogspot.com/2011/04/taming-beast-advanceddatagrid-code.html

to see if those examples get you closer to your needs

Drew Shefman
  • 1