대분류, 중분류, 소분류나 시도, 군구, 읍면동 등 상위 데이터가 선택되면 하위 선택할 데이터가 다르게 처리되어 보여지는 동적 셀렉트 박스 예제입니다.
컬럼의 데이터 타입은 selectmenu로 해주고 동적으로 처리하기 위해 inputCallback : customSelect를 지정합니다.
customSelect 함수가 불려지면서 동적으로 원하는 셀렉트 리스트를 보여줍니다.
columns : [
{ width: "100", type: "checkbox", key: "checkbox", title: ["checkbox"], show: true, sort:true, disabled: false, options: {wholeselect: true, checkedvalue: true, uncheckedvalue: false} },
{ width: "200", type: "selectmenu", key: "category1", title: ["대분류"], show: false, sort:true, disabled: false, options: {input: category1, itemcount: 3} },
{ width: "200", type: "selectmenu", key: "category2", title: ["중분류"], show: false, sort:true, disabled: true, options: { itemcount: 3, inputCallback : customSelect2} },
{ width: "200", type: "selectmenu", key: "category3", title: ["소분류"], show: false, sort:true, disabled: true, options: { itemcount: 3, inputCallback : customSelect3} },
{ width: "300", type: "input", key: "product", title: ["제품명"], show: true, sort:true, disabled: false },
],

이때 대분류를 선택해야 중분류가 활성화 되고 중분류가 선택되어야 소분류가 활동회 되도록 하기 위해서 setCellDisable(row, col, bDisable)을 사용합니다.
먼저 큐셀을 생성시 해당 컬럼을 비활성화 시켜야 합니다. disabled: true