DataTable: Tabulation is not working propertly. Also editorCallback does not reflect the new value in some cases. about primereact HOT 17 CLOSED

Nevermind see you did!

from primereact.

@kl-nevermore can you read this ticket please since the change in question was your recent change?

from primereact.

@didix16
I removed useEffect and manually sync editingRowDataStateRef according to the original plan
and removed event.preventDefault() in onCellEditComplete
The gif should be the expected behavior, right?

from primereact.

merged!

from primereact.

I've tried to rollback before #6641 modification and seems to work fine. So it's related on how switchCellToViewMode handles now the changes and maybe the useEffect for refresh the cache row state.

from primereact.

After doing some tests, I've found something. It seems that now event.preventDefault() MUST NOT be called inside onCellEditComplete. After removing this, with the current 10.6.6 version, the tabulation works ALMOST as expected. The only problem I found is that Shift + TAB can't change from first cell table to any other focusable element.

@melloware I think the documentation examples should be updated, removing the event.preventDefault() on onCellEditComplete examples.

Also I'm gonna make a PR fixing the editorCallback to properly update the value.

So finally it remains that strange bug that Shift + TAB can't change from first cell table to any other focusable element

from primereact.

Agreed. Did you want to submit a PR?

from primereact.

If you want to fix both issues in your PR I will review.

from primereact.

I would like to fix also the bug when you press Shift + TAB on first cell but at the moment I don't how to fix it without rolling back the old code. I just only found a solution for what I mentioned before. Hope someone could help

from primereact.

I think it should be the order of execution timing of useEffect and callback.

from primereact.

@didix16
I removed useEffect and manually sync editingRowDataStateRef according to the original plan
and removed event.preventDefault() in onCellEditComplete
The gif should be the expected behavior, right?

@kl-nevermore yeah that should be the expected behavior indeed. By the way, what about returning from 1rst cell to another component, using shift + TAB?

from primereact.

@didix16 @melloware
I'm not sure which one is correct

changed

10.6.5

from primereact.

Mmm maybe the changed version has more sense in terms of accessibility. It allows to focus on column headers and interact with them.

from primereact.

I would assume it accessibility related to navigate to headers.

from primereact.

@melloware
Do you know why setTimeout is used here?

const focusOnElement = () => {
        clearTimeout(tabindexTimeout.current);
        tabindexTimeout.current = setTimeout(() => {
           
            if (editingState) {
                const focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');

                focusableEl && focusableEl.focus();
            }

            keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
        }, 1);
    };

from primereact.

@didix16
submitted a PR, can you test it?
I tested it and looks ok

from primereact.

Hey @kl-nevermore. I've tested it and yeah seems that works as expected.

from primereact.