diff --git a/app/src/protyle/render/av/calc.ts b/app/src/protyle/render/av/calc.ts
index df574b160..5bc8e37e6 100644
--- a/app/src/protyle/render/av/calc.ts
+++ b/app/src/protyle/render/av/calc.ts
@@ -2,6 +2,7 @@ import {Menu} from "../../../plugin/Menu";
 import {transaction} from "../../wysiwyg/transaction";
 import {hasClosestBlock, hasClosestByClassName} from "../../util/hasClosest";
 import {fetchSyncPost} from "../../../util/fetch";
+import {getFieldsByData} from "./view";
 
 const calcItem = (options: {
     menu: Menu,
@@ -38,7 +39,7 @@ const calcItem = (options: {
                 }]);
             } else {
                 options.target.querySelector(".b3-menu__accelerator").textContent = getNameByOperator(options.operator, true);
-                const colData = (options.data.view as IAVTable).columns.find((item) => {
+                const colData = getFieldsByData(options.data).find((item) => {
                     if (item.id === options.colId) {
                         if (!item.rollup) {
                             item.rollup = {};
@@ -274,7 +275,8 @@ export const openCalcMenu = async (protyle: IProtyle, calcElement: HTMLElement,
             const avResponse = await fetchSyncPost("api/av/renderAttributeView", {id: avId});
             avData = avResponse.data;
         }
-        (avData.view as IAVTable).columns.find((item) => {
+
+        getFieldsByData(avData).find((item) => {
             if (item.id === colId) {
                 relationKeyID = item.rollup?.relationKeyID;
                 keyID = item.rollup?.keyID;
@@ -283,7 +285,7 @@ export const openCalcMenu = async (protyle: IProtyle, calcElement: HTMLElement,
         });
         if (relationKeyID && keyID) {
             let relationAvId: string;
-            (avData.view as IAVTable).columns.find((item) => {
+            getFieldsByData(avData).find((item) => {
                 if (item.id === relationKeyID) {
                     relationAvId = item.relation?.avID;
                     return true;
diff --git a/app/src/protyle/render/av/relation.ts b/app/src/protyle/render/av/relation.ts
index 6e5c2db0a..c09d922c0 100644
--- a/app/src/protyle/render/av/relation.ts
+++ b/app/src/protyle/render/av/relation.ts
@@ -9,6 +9,9 @@ import {updateAttrViewCellAnimation} from "./action";
 import {focusBlock} from "../../util/selection";
 import {setPosition} from "../../../util/setPosition";
 import * as dayjs from "dayjs";
+import {getFieldsByData} from "./view";
+import {getColId} from "./col";
+import {getFieldIdByCellElement} from "./row";
 
 const genSearchList = (element: Element, keyword: string, avId?: string, excludes = true, cb?: () => void) => {
     fetchPost("/api/av/searchAttributeView", {
@@ -329,8 +332,8 @@ ${html || genSelectItemHTML("empty")}`;
 
 export const getRelationHTML = (data: IAV, cellElements?: HTMLElement[]) => {
     let colRelationData: IAVColumnRelation;
-    data.view.columns.find(item => {
-        if (item.id === cellElements[0].dataset.colId) {
+    getFieldsByData(data).find(item => {
+        if (item.id === getColId(cellElements[0], data.viewType)) {
             colRelationData = item.relation;
             return true;
         }
@@ -359,14 +362,18 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar
     if (menuElement.querySelector(".dragover__bottom, .dragover__top")) {
         return;
     }
-    const rowElement = hasClosestByClassName(cellElements[0], "av__row");
-    if (!rowElement) {
-        return;
-    }
+
     if (!nodeElement.contains(cellElements[0])) {
-        cellElements[0] = (nodeElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElements[0].dataset.colId}"]`) ||
-            nodeElement.querySelector(`.fn__flex-1[data-col-id="${cellElements[0].dataset.colId}"]`)) as HTMLElement;
+        const viewType = nodeElement.getAttribute("data-av-type") as TAVView;
+        const rowID = getFieldIdByCellElement(cellElements[0], viewType);
+        if (viewType === "table") {
+            cellElements[0] = (nodeElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${cellElements[0].dataset.colId}"]`) ||
+                nodeElement.querySelector(`.fn__flex-1[data-col-id="${cellElements[0].dataset.colId}"]`)) as HTMLElement;
+        } else {
+            cellElements[0] = (nodeElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${cellElements[0].dataset.fieldId}"]`)) as HTMLElement;
+        }
     }
+
     const newValue: IAVCellRelationValue = {blockIDs: [], contents: []};
     menuElement.querySelectorAll('[draggable="true"]').forEach(item => {
         const id = item.getAttribute("data-id");
diff --git a/app/src/protyle/render/av/rollup.ts b/app/src/protyle/render/av/rollup.ts
index f25164689..051529bbb 100644
--- a/app/src/protyle/render/av/rollup.ts
+++ b/app/src/protyle/render/av/rollup.ts
@@ -5,9 +5,10 @@ import {fetchPost} from "../../../util/fetch";
 import {escapeHtml} from "../../../util/escape";
 import {transaction} from "../../wysiwyg/transaction";
 import {unicode2Emoji} from "../../../emoji";
-import {getColIconByType} from "./col";
+import {getColIconByType, getColId} from "./col";
 import {showMessage} from "../../../dialog/message";
 import {getNameByOperator} from "./calc";
+import {getFieldsByData} from "./view";
 
 const updateCol = (options: {
     target: HTMLElement,
@@ -20,7 +21,7 @@ const updateCol = (options: {
         return;
     }
     options.target.querySelector(".b3-menu__accelerator").textContent = itemElement.querySelector(".b3-list-item__text").textContent;
-    const colData = options.data.view.columns.find((item) => {
+    const colData = getFieldsByData(options.data).find((item) => {
         if (item.id === options.colId) {
             if (!item.rollup) {
                 item.rollup = {};
@@ -166,8 +167,8 @@ export const getRollupHTML = (options: { data?: IAV, cellElements?: HTMLElement[
     if (options.colData) {
         colData = options.colData;
     } else {
-        options.data.view.columns.find((item) => {
-            if (item.id === options.cellElements[0].dataset.colId) {
+        getFieldsByData(options.data).find((item) => {
+            if (item.id === getColId(options.cellElements[0], options.data.viewType)) {
                 colData = item;
                 return true;
             }
@@ -201,7 +202,7 @@ export const bindRollupData = (options: {
         const goSearchRollupTargetElement = options.menuElement.querySelector('[data-type="goSearchRollupTarget"]') as HTMLElement;
         let targetKeyAVId = "";
         if (oldValue.relationKeyID) {
-            options.data.view.columns.find((item) => {
+            getFieldsByData(options.data).find((item) => {
                 if (item.id === oldValue.relationKeyID) {
                     goSearchRollupColElement.querySelector(".b3-menu__accelerator").textContent = item.name;
                     targetKeyAVId = item.relation.avID;
diff --git a/app/src/protyle/render/av/row.ts b/app/src/protyle/render/av/row.ts
index 423aef514..1778dff03 100644
--- a/app/src/protyle/render/av/row.ts
+++ b/app/src/protyle/render/av/row.ts
@@ -16,9 +16,9 @@ import * as dayjs from "dayjs";
 import {Constants} from "../../../constants";
 import {insertGalleryItemAnimation} from "./gallery/item";
 
-export const getFieldIdByCellElement = (cellElement: Element, viewType:TAVView): string => {
+export const getFieldIdByCellElement = (cellElement: Element, viewType: TAVView): string => {
     return (hasClosestByClassName(cellElement, viewType === "table" ? "av__row" : "av__gallery-item") as HTMLElement).dataset.id;
-}
+};
 
 export const selectRow = (checkElement: Element, type: "toggle" | "select" | "unselect" | "unselectAll") => {
     const rowElement = hasClosestByClassName(checkElement, "av__row");