Fixed https://github.com/surveyjs/private-tasks/issues/431 - SurveyJS…

… Creator - Property Grid - Cannot read properties of undefined (reading 'imageLink')
surveyjs · Jan 20, 2025 · c22d04f · c22d04f
1 parent a77ca17
commit c22d04f
Show file tree

Hide file tree

Showing 8 changed files with 472 additions and 445 deletions.
diff --git a/packages/survey-creator-core/src/components/action-container-view-model.ts b/packages/survey-creator-core/src/components/action-container-view-model.ts
diff --git a/packages/survey-creator-core/src/components/page.ts b/packages/survey-creator-core/src/components/page.ts
@@ -1,7 +1,7 @@
 import { Action, ActionContainer, classesToSelector, ComputedUpdater, DragOrClickHelper, DragTypeOverMeEnum, IAction, IElement, PageModel, property, QuestionRowModel, SurveyElement, settings as SurveySettings } from "survey-core";
 import { SurveyCreatorModel } from "../creator-base";
 import { IPortableMouseEvent } from "../utils/events";
-import { SurveyElementAdornerBase } from "./action-container-view-model";
+import { SurveyElementAdornerBase } from "./survey-element";
 import { getLocString } from "../editorLocalization";
 import { SurveyHelper } from "../survey-helper";
 import { settings } from "../creator-settings";
@@ -129,10 +129,10 @@ export class PageAdorner extends SurveyElementAdornerBase<PageModel> {
   }
   @property({
     onSet(val, target: PageAdorner, prevVal) {
-      if(val != prevVal) {
+      if (val != prevVal) {
         target.updateShowPlaceholder();
         target.updateActionsProperties();
-        if(val && target.surveyElement) {
+        if (val && target.surveyElement) {
           target.addGhostPageSubsribes(target.surveyElement);
         }
       }
@@ -326,7 +326,7 @@ export class PageAdorner extends SurveyElementAdornerBase<PageModel> {
     if (cssClasses.pageRow) return [].slice.call(this.rootElement?.querySelectorAll(`:scope .svc-page__footer, :scope ${classesToSelector(this.surveyElement.cssRoot)} > .svc-row`));
     return null;
   }
-  public onPageSelected() {}
+  public onPageSelected() { }
   protected getAllowDragging(options: any): boolean {
     return this.creator.allowDragPages && super.getAllowDragging(options);
   }

diff --git a/packages/survey-creator-core/src/components/question-image.ts b/packages/survey-creator-core/src/components/question-image.ts
@@ -44,11 +44,25 @@ export class QuestionImageAdornerViewModel extends QuestionAdornerViewModel {
   ) {
     super(creator, surveyElement, templateData);
     this.isEmptyImageLink = !this.question.imageLink;
-    this.surveyElement.registerFunctionOnPropertyValueChanged("imageLink", this.imageLinkValueChangedHandler, "imageLinkValueChanged");
-    (this.surveyElement as QuestionImageModel).locImageLink.onStringChanged.add(this.imageLinkValueChangedHandler);
     this.initFilePresentationModel();
   }
 
+  protected detachElement(surveyElement: SurveyElement): void {
+    if (surveyElement) {
+      surveyElement.unRegisterFunctionOnPropertyValueChanged("imageLink", "imageLinkValueChanged");
+      (surveyElement as QuestionImageModel).locImageLink.onStringChanged.remove(this.imageLinkValueChangedHandler);
+    }
+    super.detachElement(this.element);
+  }
+  protected attachElement(surveyElement: SurveyElement): void {
+    super.attachElement(surveyElement);
+    if (surveyElement) {
+      surveyElement.registerFunctionOnPropertyValueChanged("imageLink", this.imageLinkValueChangedHandler, "imageLinkValueChanged");
+      (surveyElement as QuestionImageModel).locImageLink.onStringChanged.add(this.imageLinkValueChangedHandler);
+    }
+  }
+
+
   @property({ defaultValue: false }) isUploading;
   @property({ defaultValue: false }) isEmptyImageLink;
 
@@ -100,11 +114,4 @@ export class QuestionImageAdornerViewModel extends QuestionAdornerViewModel {
       .append(super.css())
       .append("svc-question__content--loading", this.isUploading).toString();
   }
-  public dispose(): void {
-    if (this.surveyElement) {
-      this.surveyElement.unRegisterFunctionOnPropertyValueChanged("imageLink", "imageLinkValueChanged");
-      (this.surveyElement as QuestionImageModel).locImageLink.onStringChanged.remove(this.imageLinkValueChangedHandler);
-    }
-    super.dispose();
-  }
 }
diff --git a/packages/survey-creator-core/src/components/question.ts b/packages/survey-creator-core/src/components/question.ts
@@ -34,14 +34,15 @@ import {
   isPropertyVisible,
   propertyExists,
 } from "../utils/creator-utils";
-import { SurveyElementActionContainer, SurveyElementAdornerBase } from "./action-container-view-model";
+import { SurveyElementActionContainer } from "./action-container-view-model";
 require("./question.scss");
 import { settings } from "../creator-settings";
 import { StringEditorConnector, StringItemsNavigatorBase } from "./string-editor";
 import { DragDropSurveyElements, isPanelDynamic } from "../survey-elements";
 import { QuestionToolbox, QuestionToolboxItem } from "../toolbox";
 import { isUndefined } from "lodash";
 import { listComponentCss } from "./list-theme";
+import { SurveyElementAdornerBase } from "./survey-element";
 
 export interface QuestionBannerParams {
   text: string;
@@ -680,7 +681,7 @@ export class QuestionAdornerViewModel extends SurveyElementAdornerBase {
       cssClasses: listComponentCss,
     });
     newAction.popupModel.onVisibilityChanged.add((_: PopupModel, opt: { model: PopupModel, isVisible: boolean }) => {
-      if(opt.isVisible) {
+      if (opt.isVisible) {
         const listModel = newAction.popupModel.contentComponentData.model;
         options.updateListModel(listModel);
       }