diff --git a/public/app/plugins/panel/datagrid/DataGridPanel.tsx b/public/app/plugins/panel/datagrid/DataGridPanel.tsx
index 679049e51da..c2d058eacc0 100644
--- a/public/app/plugins/panel/datagrid/DataGridPanel.tsx
+++ b/public/app/plugins/panel/datagrid/DataGridPanel.tsx
@@ -196,7 +196,7 @@ export function DataGridPanel({ options, data, id, fieldConfig, width, height }:
   const onHeaderMenuClick = (col: number, screenPosition: Rectangle) => {
     dispatch({
       type: DatagridActionType.openHeaderDropdownMenu,
-      payload: { screenPosition, columnIndex: col, value: frame.fields[col].name },
+      payload: { screenPosition, columnIndex: col, value: state.columns[col].title },
     });
   };
 
diff --git a/public/app/plugins/panel/datagrid/state.ts b/public/app/plugins/panel/datagrid/state.ts
index fe414b124ca..c8d17a68a01 100644
--- a/public/app/plugins/panel/datagrid/state.ts
+++ b/public/app/plugins/panel/datagrid/state.ts
@@ -219,11 +219,10 @@ export const datagridReducer = (state: DatagridState, action: DatagridAction): D
 
       columns = [
         ...updateColumnsPayload.frame.fields.map((field: Field, index: number) => {
-          const displayName = getFieldDisplayName(field, updateColumnsPayload.frame);
-
           // find column by field name and update width in new set. We cannot use index because
           // if a column gets deleted we don't know the correct index anymore
-          const width = state.columns.find((column) => column.title === displayName)?.width;
+          const width = state.columns.find((column) => column.title === field.name)?.width;
+          const displayName = getFieldDisplayName(field, updateColumnsPayload.frame);
 
           return {
             title: displayName,
diff --git a/public/app/plugins/panel/datagrid/utils.ts b/public/app/plugins/panel/datagrid/utils.ts
index ab14d01f809..43f5d41f652 100644
--- a/public/app/plugins/panel/datagrid/utils.ts
+++ b/public/app/plugins/panel/datagrid/utils.ts
@@ -77,6 +77,11 @@ export async function updateSnapshot(
   updateData?: (frames: DataFrame[]) => Promise<boolean>
 ): Promise<boolean> {
   if (updateData && isDatagridEnabled()) {
+    for (let i = 0; i < frame.fields.length; i++) {
+      delete frame.fields[i].config.displayName;
+      delete frame.fields[i].config.displayNameFromDS;
+    }
+
     return await updateData([frame]);
   }