The validation (isUnique) doesn't work if "value" property in itemval…

…ue is moved to detail panel from the list fix #5506

packages/survey-creator-core/src/property-grid/matrices.ts

@@ -79,10 +79,11 @@ export abstract class PropertyGridEditorMatrix extends PropertyGridEditor {
     this.initializePlaceholder(rowObj, q, options.columnName);
     q.property = Serializer.findProperty(rowObj.getType(), options.columnName);
   }
+  /*
   public onMatrixCellValueChanged(obj: Base, options: any) {
     const matrix = options.question;
     const column = options.column;
-    if (matrix && column && column.isUnique) {
+    if (column && column.isUnique || options.columnName === matrix.keyName) {
       matrix.visibleRows.forEach(row => {
         if (row !== options.row) {
           const question = <Question>row.getQuestionByColumnName(options.columnName);
@@ -92,7 +93,7 @@ export abstract class PropertyGridEditorMatrix extends PropertyGridEditor {
         }
       });
     }
-  }
+  }*/
   public onGetMatrixRowAction(
     obj: Base,
     options: any,
@@ -348,12 +349,13 @@ export abstract class PropertyGridEditorMatrix extends PropertyGridEditor {
     if (!className) {
       className = prop.baseClassName;
     }
-    var columns = this.getColumnsJSON(obj, prop, propNames, options, propGridDefinition);
-    var res: any = {
+    const columns = this.getColumnsJSON(obj, prop, propNames, options, propGridDefinition);
+    const res: any = {
       type: "matrixdynamic",
       detailPanelMode: "underRow",
       cellType: "text",
       rowCount: 0,
+      keyName: this.getKeyName(prop),
       columns: columns,
       showHeader: columns.length > 1,
       hideColumnsIfEmpty: true,
@@ -393,15 +395,23 @@ export abstract class PropertyGridEditorMatrix extends PropertyGridEditor {
   protected filterPropertyNames(propNames: Array<string>, options: ISurveyCreatorOptions): Array<string> {
     return propNames;
   }
+  private getClassNameByProp(prop: JsonObjectProperty): string {
+    return !!prop.className ? prop.className: prop.baseClassName;
+  }
+  private getKeyName(prop: JsonObjectProperty): string {
+    const className = this.getClassNameByProp(prop);
+    if(!className) return "";
+    const props = Serializer.getProperties(className);
+    for(let i = 0; i < props.length; i ++) {
+      if(props[i].isUnique) return props[i].name;
+    }
+    return "";
+  }
   protected getColumnsJSON(obj: Base, prop: JsonObjectProperty, propNames: Array<string>,
     options: ISurveyCreatorOptions, propGridDefinition: ISurveyPropertyGridDefinition
   ) {
-    var className = prop.className;
-    if (!className) {
-      className = prop.baseClassName;
-    }
     var res = new PropertyJSONGenerator(obj, options, undefined, undefined, propGridDefinition).createColumnsJSON(
-      className,
+      this.getClassNameByProp(prop),
       this.filterPropertyNames(propNames, options)
     );
     for (var i = 0; i < res.length; i++) {
@@ -573,7 +583,6 @@ export class PropertyGridEditorMatrixItemValues extends PropertyGridEditorMatrix
     }
   }
   public onMatrixCellValueChanged(obj: Base, options: any) {
-    super.onMatrixCellValueChanged(obj, options);
     if (obj instanceof QuestionRatingModel && options.columnName == "icon") {
       //options.cellQuestion.html = "<svg style='fill: red'><use xlink:href=\"#" + options.cellQuestion.value + "\"></use></svg>";
       options.cellQuestion.html = options.cellQuestion.value;
@@ -786,7 +795,6 @@ export abstract class PropertyGridEditorMatrixMultipleTypes extends PropertyGrid
     }
   }
   public onMatrixCellValueChanged(obj: Base, options: any) {
-    super.onMatrixCellValueChanged(obj, options);
     if (options.columnName !== this.getObjTypeName()) return;
     var index = options.question.visibleRows.indexOf(options.row);
     if (index < 0) return;

packages/survey-creator-core/tests/property-grid/property-grid.tests.ts

@@ -1309,6 +1309,39 @@ test("matrix columns and rows has column value with isUnique property set to tru
   const rowsQuestion = <QuestionMatrixDynamicModel>propertyGrid.survey.getQuestionByName("rows");
   expect(columnsQuestion.getColumnByName("value").isUnique).toBeTruthy();
   expect(rowsQuestion.getColumnByName("value").isUnique).toBeTruthy();
+  expect(columnsQuestion.keyName).toBe("value");
+  expect(rowsQuestion.keyName).toBe("value");
+});
+test("choices values check on unique", () => {
+  const question = new QuestionDropdownModel("q1");
+  question.choices = ["item1", "item2", "item3"];
+  const propertyGrid = new PropertyGridModelTester(question);
+  const matrix = <QuestionMatrixDynamicModel>propertyGrid.survey.getQuestionByName("choices");
+  expect(matrix.keyName).toBe("value");
+  const cellQuestion = matrix.visibleRows[0].getQuestionByColumnName("value");
+  expect(cellQuestion.errors).toHaveLength(0);
+  cellQuestion.value = "item2";
+  expect(cellQuestion.errors).toHaveLength(1);
+  cellQuestion.value = "item4";
+  expect(cellQuestion.errors).toHaveLength(0);
+});
+test("choices values check on unique when value is the detail panel", () => {
+  const prop = Serializer.findProperty("itemvalue", "value");
+  const prevShowMode = prop.showMode;
+  prop.showMode = "form";
+  const question = new QuestionDropdownModel("q1");
+  question.choices = ["item1", "item2", "item3"];
+  const propertyGrid = new PropertyGridModelTester(question);
+  const matrix = <QuestionMatrixDynamicModel>propertyGrid.survey.getQuestionByName("choices");
+  expect(matrix.keyName).toBe("value");
+  matrix.visibleRows[0].showDetailPanel();
+  const cellQuestion = matrix.visibleRows[0].detailPanel.getQuestionByName("value");
+  expect(cellQuestion.errors).toHaveLength(0);
+  cellQuestion.value = "item2";
+  expect(cellQuestion.errors).toHaveLength(1);
+  cellQuestion.value = "item4";
+  expect(cellQuestion.errors).toHaveLength(0);
+  prop.showMode = prevShowMode;
 });
 test("matrix dropdown rows has column value with isUnique property set to true", () => {
   const question = new QuestionMatrixDropdownModel("q1");