안녕하세요. 여러 도움주셔서 감사합니다.
말씀하신데로 적용하려다 보니 몇가지 문의사항이 있습니다.
initialized 속성에 grid.hostElement.addEventListener('click') 이벤트는
넣었습니다.
initialized 속성에 grid.formatItem.addHandler 도 넣으려 했으나
조회가 될때마다 가변적인 header칼럼갯수를 담은 변수(confirmCnt)에 값이 안들어와서
onloadedRows 속성에 예전처럼 설정할 수 밖에 없었는데요.
onloadedRows 말고 다른 방법이 있는지 궁금합니다.
그리고 현재설정상태에서 left checkbox 선택후 header checkbox를 선택/해제시 문제없이 동작을 하는데
header checkbox 설정후 left checkbox를 선택/해제하면 header checkbox가
모두 해제되버리는 문제가 발생하는데요.
header checkbox 체크/해제할때마다 grid.formatItem.addHandler 이벤트를 타면서
header checkbox를 모두 초기화 시켜버리는 것 같습니다.
이부분 또한 해결방법이 없는지 궁금합니다.
그리고 한가지 더 문의사항이 있는데요.
조회버튼을 클릭하여 조회가 완료되는 시점을 catch할 수 있는 이벤트나 속성이 있는지 궁급합니다.
조회완료때마다 체크박스를 없애고 다시 설정하는 부분(e._cell.innerHTML = '')이
grid.formatItem.addHandler 이벤트에 들어있어 header checkbox , left checkbox 변동이
생길때마다 계속 e._cell.innerHTML = '' 이부분이 실행되어서 문제가 되는 것도 같습니다.
감사합니다.
--------------------------------------------------------------------------------
const initGrid = useEvent(grid => { // =>> initialized 속성에 입력
grid.hostElement.addEventListener('click', function (e: any) {
var ht = grid.hitTest(e)
let isChecked = false
const updateColumnValues = () => {
grid.rows.forEach((row: any, idx: number) => {
grid.columns.forEach((col: any, jdx: number) => {
if (jdx > 4) {
if (idx % 4 === 0) {
if (row.isSelected === true) {
isChecked = true
} else {
isChecked = false
}
}
if (idx % 4 === 3) {
if (isChecked === true && col.checkedHeader === true) {
grid.setCellData(idx, jdx, 'FIXED')
} else {
grid.setCellData(idx, jdx, '')
}
}
}
})
})
//grid.refresh()
}
if (ht.panel) {
const {cellType} = ht.panel
if (
(cellType === CellType.ColumnHeader && hasClass(e.target, 'customHeaderChk')) ||
(cellType === CellType.RowHeader && hasClass(e.target, 'wj-column-selector')) ||
(cellType === CellType.TopLeft &&
hasClass(e.target, 'wj-column-selector-group'))
) {
if (cellType == CellType.ColumnHeader) {
grid.columns[ht.col].checkedHeader = e.target.checked
}
updateColumnValues()
}
}
})
})
const onloadedRows = useEvent(grid => { // =>> loadedRows 속성에 입력
grid.formatItem.addHandler((s: any, e: any) => {
let colIdx = confirmCnt + 5
let col = s.columns[e.col]
if (
e.panel.cellType === CellType.ColumnHeader &&
e.row === 2 &&
e.col > 4
) {
const totalCols = grid.cells._cols.length
if (confirmCnt > 0) {
if (e.col > 4 && e.col < totalCols && e.row === 2) {
e._cell.innerHTML = ''
}
if (e.col > 4 && e.col < colIdx && e.row === 2) {
if ((e.col - 4) % 8 != 0) {
//체크박스 생성 및 초기화화
e.cell.innerHTML =
`<input class= "customHeaderChk" type = "checkbox" ${
col.checkedHeader ? 'checked' : ''
}>` + e.cell.innerHTML
}
}
} else {
if (e.col > 4 && e.col < totalCols && e.row === 2) {
e._cell.innerHTML = ''
}
}
}
})
})