Fixed #2923 - Frozen columns and non-frozen columns can be reordered …

…with each other in DataTable
primefaces · May 25, 2022 · 265d7e4 · 265d7e4
1 parent c922d43
commit 265d7e4
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/components/lib/datatable/DataTable.js b/components/lib/datatable/DataTable.js
@@ -562,7 +562,7 @@ export const DataTable = React.forwardRef((props, ref) => {
 
         const { originalEvent: event, column } = e;
 
-        if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false) {
+        if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false && !getColumnProp(column, 'frozen')) {
             if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || DomHandler.hasClass(event.target, 'p-column-resizer'))
                 event.currentTarget.draggable = false;
             else
@@ -616,9 +616,9 @@ export const DataTable = React.forwardRef((props, ref) => {
     }
 
     const onColumnHeaderDragOver = (e) => {
-        const { originalEvent: event } = e;
+        const { originalEvent: event, column } = e;
         const dropHeader = findParentHeader(event.currentTarget);
-        if (props.reorderableColumns && draggedColumnElement.current && dropHeader) {
+        if (props.reorderableColumns && draggedColumnElement.current && dropHeader && !getColumnProp(column, 'frozen')) {
             event.preventDefault();
 
             if (draggedColumnElement.current !== dropHeader) {

diff --git a/components/lib/datatable/HeaderCell.js b/components/lib/datatable/HeaderCell.js
@@ -269,14 +269,15 @@ export const HeaderCell = React.memo((props) => {
         const sortMeta = getSortMeta();
         const style = getStyle();
         const align = getColumnProp('alignHeader') || getColumnProp('align');
+        const frozen = getColumnProp('frozen');
         const className = classNames(getColumnProp('headerClassName'), getColumnProp('className'), {
             'p-sortable-column': getColumnProp('sortable'),
             'p-resizable-column': props.resizableColumns && getColumnProp('resizeable'),
             'p-highlight': sortMeta.sorted,
-            'p-frozen-column': getColumnProp('frozen'),
+            'p-frozen-column': frozen,
             'p-selection-column': getColumnProp('selectionMode'),
             'p-sortable-disabled': getColumnProp('sortable') && _isSortableDisabled,
-            'p-reorderable-column': props.reorderableColumns && getColumnProp('reorderable'),
+            'p-reorderable-column': props.reorderableColumns && getColumnProp('reorderable') && !frozen,
             [`p-align-${align}`]: !!align
         });
         const tabIndex = getColumnProp('sortable') && !_isSortableDisabled ? props.tabIndex : null;