CheckBoxSet 소개

CheckBoxSet 컴포넌트는 여러 아이템 목록 중에서 한 개 이상의 값을 선택하기 위한 용도로 사용하는 컴포넌트입니다. 각 아이템은 CheckBox 컴포넌트와 비슷하며 아이템의 배치 등의 동작은 Radio 컴포넌트와 비슷합니다.

Radio 컴포넌트는 하나의 답만 선택할 수 있는 객관식 문제라면 CheckBoxSet 컴포넌트는 2개 이상의 답을 선택할 수 있는 객관식 문제입니다.

사용 예

넥사크로 스튜디오 옵션창에서 값 선택 시 여러 개 값을 선택할 수 있는 속성이 있습니다. 예를 들어 Form Design > Paste Special 옵션의 경우 컴포넌트 복사 시 복사할 대상을 여러 개 선택할 수 있습니다.

선택할 수 없는 아이템 설정하기

상품 재고 목록에서 재고가 없는 아이템은 선택할 수 없게 설정합니다.

예제

Grid 컴포넌트 stock 칼럼의 값을 0으로 변경하면 해당 데이터를 CheckBoxSet 컴포넌트에서 선택할 수 없게 변경합니다. 다시 데이터를 0 이상의 값으로 변경하면 CheckBoxSet 컴포넌트에서 선택할 수 있게 상태를 변경합니다.

sample_checkboxset_01.xfdl

예제에서 사용한 핵심 기능

readonlycolumn

칼럼값에 따라 선택할 수 있는 상태를 변경할 수 있습니다. 예제에서는 readonlycolumn 데이터를 동적으로 변경해 입력값에 따라 선택 여부 상태를 변경합니다.

editautoselect

edittype 속성값이 "text"인 경우 editautoselect 속성값을 true로 설정하면 사용자가 편집 영역을 클릭했을 때 텍스트를 전체 선택하도록 설정할 수 있습니다. 입력값 수정 시 사용자가 따로 편집 대상을 선택하지 않고 바로 수정할 수 있게 합니다.

editinputtype

입력할 수 있는 값의 범위를 설정합니다. 예제에서는 숫자만 입력할 것이기 때문에 "digit"로 설정합니다. "number"로 설정한 경우에는 마침표("."), 콤마(","), 마이너스("-") 문자를 입력할 수 있습니다.

예제 구현 방법

innerdataset: dsCheckBoxSet
codecolumn: code
datacolumn: data
readonlycolumn: readonly

displaytype: editcontrol
edittype: text
editautoselect: true
editinputtype: digit

stock 칼럼의 값이 0인지 아닌지에 따라 CheckBoxSet 컴포넌트에 바인딩된 Dataset 오브젝트의 readonly 칼럼값을 변경합니다.

this.dsGrid_oncolumnchanged = function(obj:nexacro.NormalDataset,e:nexacro.DSColChangeEventInfo) {
  if (e.columnid === 'stock') {
    var targetRow = this.dsCheckBoxSet.findRow("code", obj.getColumn(e.row, 0));
    var newValue = e.newvalue;
    var readonlyValue = (newValue === 0) ? 1 : 0;
    this.dsCheckBoxSet.setColumn(targetRow, "readonly", readonlyValue);
  }
};