RealGrid2 가이드
데이터 관리
Object 타입 필드

Object Type Field

ObjectType의 데이터를 표시할 수 있습니다.
기본적으로 편집이 되지 않으며 ObjectKey를 지정시 편집할 수 있습니다.
ObjectKey를 지정하면 지정된 속성값만 편집/표시 됩니다.

//데이터의 형태
[
  {
    "Person": {
      "Name": "박영호",
      "Address": "서울특별시 강서구 공항동 45-89"
    },
    "Gender": "남",
    "Age": "71",
...
  },
  {
    "Person": {
      "Name": "조일형",
      "Address": "서울특별시 중구 봉래동2가 122"
    },
    "Gender": "남",
    "Age": "62",
...
  },
...
];
//필드 설정
var fields = [
  {
    fieldName: "Person",
    dataType: "object",
    objectKey: "Name"
  },
...
];
 
dataProvider.setFields(fields);
 
//컬럼 설정
var columns = [
  {
    name: "Person",
    fieldName: "Person",
    objectKey: "Name",
    width: "300",
    header: {
      text: "이름"
    }
  },
  ...
];
 
gridView.setColumns(columns);

주의사항

  1. Object 필드 복사시 화면에 보이는 Text가 아니라 Object가 복사됩니다.
  2. Object 필드에 붙여넣기시 같은 Object Data만 붙여넣을 수 있습니다. 일반 Text의 경우 붙여넣을 수 없습니다.
  3. 하나의 Object 필드에 여러 개의 컬럼 사용시 소트 기능은 ObjectKey가 지정된 컬럼을 기준으로 실행됩니다. 예를 들어 아래와 같이 Object Field의 objectKey 속성에 Name의 지정되어 있기 때문에 PersonName컬럼과 PersonAddress컬럼은 모두 이름으로 소팅 됩니다. 이때 컬럼 필터는 사용할 수 없습니다.

하나의 Object 필드 - 두 개의 컬럼 사용예

const fields = [
  {
      fieldName: "Person",
      dataType: "object",
      objectKey: "Name"
  },
...
]
 
const columns = [
  {
      name: "PersonName",
      fieldName: "Person",
      objectKey: "Name",
      width: "150",
      header: {
          text: "이름"
      }
  },
  {
      name: "PersonAddress",
      fieldName: "Person",
      objectKey: "Address",
      width: "150",
      header: {
          text: "주소"
      }
  },
]

objectCallback

객체가 2 depth 이상으로 되어 있는 값인 경우 데이터 출력을 위해 objectCallback을 사용해서 화면에 보여지도록 설정할 수 있습니다.

objectCallback 에서 반환되는 값이 그리드에 출력됩니다. data 인자값으로 해당 필드의 값을 가져옵니다.

{
  name: "PersonAddress",
  fieldName: "Person",
  objectCallback:function(fieldName, dataRow, data){ 
    return data.Address
  },
  width: "300",
  header: {
    text: "주소"
  }
}